角4打字稿，点击一个按钮，弹出打开文件对话框

想在.component.html点击如下按钮时打开标准的文件打开对话框：角4打字稿，点击一个按钮，弹出打开文件对话框

<button md-fab md-tooltip="Input"> 
    <md-icon class="md-24">input</md-icon> 
</button>

似乎是常见的方式，打开对话框是使用像这样的输入标签：

<input type=”file”>

但它在屏幕上显示额外的东西。思维在做弹出的.component.ts用（点击）：

<button md-fab md-tooltip="Input" (click)="onClick()"> 
    <md-icon class="md-24">input</md-icon> 
</button

，但无法找到一种方法即可弹出的.ts文件打开对话框，请帮助。

@角/ CLI：1.0.1 节点：7.7.4 操作系统：Win32的64 @角/ XXXX：4.0.3

来源

2017-04-26 brewphone

[文件从JavaScript \ *对话框，不\ * ]的可能的复制（http://stackoverflow.com/questions/8385758/file-dialog-from-javascript-without-input） –

[answer]（http://stackoverflow.com/a/35209681/1464938）这里比较简单。感谢大家的帮助。 – brewphone

它也可能有所帮助https://www.code-sample.com/2017/11/angular-4-open-dialog-box-on-click.html –

您似乎采用了棱角分明的材料。你有没有试图遵循这个例子？ https://material.angular.io/components/component/dialog。当前代码直接来自链接中的示例。在html：

<button md-button (click)="openDialog()">Launch dialog</button>

而且在当.ts文件：

import {Component} from '@angular/core'; 
import {MdDialog, MdDialogRef} from '@angular/material'; 


@Component({ 
    selector: 'dialog-result-example', 
    templateUrl: './dialog-result-example.html', 
}) 
export class DialogResultExample { 
    selectedOption: string; 

    constructor(public dialog: MdDialog) {} 

    openDialog() { 
    let dialogRef = this.dialog.open(DialogResultExampleDialog); 
    dialogRef.afterClosed().subscribe(result => { 
     this.selectedOption = result; 
    }); 
    } 
} 


@Component({ 
    selector: 'dialog-result-example-dialog', 
    templateUrl: './dialog-result-example-dialog.html', 
}) 
export class DialogResultExampleDialog { 
    constructor(public dialogRef: MdDialogRef<DialogResultExampleDialog>) {} 
}

来源

2017-04-26 14:38:36 John

谢谢你的作品。 – brewphone

角4打字稿，点击一个按钮，弹出打开文件对话框

回答

相关问题