角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打字稿，點擊一個按鈕，彈出打開文件對話框

回答

相關問題