Angulaire 4 Tapuscrit, cliquez sur un bouton de la pop dialogue d'ouverture de fichier

Souhaitez ouvrir la boite de dialogue standard en cliquant sur bouton et de suivi dans le .component.html:

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

semble la façon la plus courante pour ouvrir une boîte de dialogue est d'utiliser des balises d'entrée comme ceci:

<input type=”file”>

mais il montre des choses sur l'écran. La pensée de le faire apparaître dans le .composante.ts avec une (clic) dans l' :

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

mais ne pouvait pas trouver un moyen de pop-up de dialogue d'ouverture de fichier dans .ts, s'il vous plaît aider.

@angulaire/cli: 1.0.1
nœud: 7.7.4
os: win32 x64
@angulaire/xxxx: 4.0.3

InformationsquelleAutor brewphone | 2017-04-26
  1. 6

    Il semble que vous êtes en utilisant angulaire du matériel. Avez-vous essayé de suivre cet exemple? https://material.angular.io/components/component/dialog.
    Code actuel est pris directement à partir de l'exemple dans le lien.
    dans le code html:

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

    Et dans le .ts fichier:

    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>) {}
}
    InformationsquelleAutor John