24

material2 のダイアログ コンポーネントを実装していて、この問題に直面しました。

ビジネス要件に従って、開発者がダイアログにテキストを入力できる、すべての確認タイプのメッセージに対して一般的なダイアログを作成したいと考えています。しかし、ドキュメントによると、そのような規定はありません。同じ問題を回避する方法はありますか、それとも機能リクエストとして github に投稿する必要がありますか?

export class ConfirmationDialogComponent implements OnInit {
  @Input() confirmationText: string;
  @Input() confirmationTitle: string;
  @Input() confirmationActions: [string, string][] = [];

  constructor(public dialogRef: MdDialogRef<ConfirmationDialogComponent>) {}

  ngOnInit() {}
}

次のように呼び出します。

let dialogRef = this.dialog.open(ConfirmationDialogComponent);
4

1 に答える 1

40

open はコンポーネントインスタンスを提供します。これは、次のように必要なものを注入できることを意味します。

openDialog() {
    let dialogRef = this.dialog.open(DialogOverviewExampleDialog);
    let instance = dialogRef.componentInstance;
    instance.text = "This text can be used inside DialogOverviewExampleDialog template ";
    console.log('dialogRef',dialogRef);
  }

次に、明らかに DialogOverviewExampleDialog テンプレート内で次のことができます。

   this is the text {{text }}

プランカー

私が通常行うことは、コンポーネントが理解する構成オブジェクトを作成し、モーダルを開くときにこれを渡します。

 private config = {
    title :"Hello there ",
    text :"What else ? "
 };

 openDialog() {
    let dialogRef = this.dialog.open(DialogOverviewExampleDialog);
    let instance = dialogRef.componentInstance;
    instance.config = this.config;
    console.log('dialogRef',dialogRef);
  }

そして、モーダル コンポーネント内:

<div class="my-modal">
   <h1>{{config.title}}</h1>
   <p>{{config.text}}</p>
</div>
于 2016-12-28T07:55:54.137 に答える