將參數傳遞給 mat-dialog 打開方法

Question

角 7.1 ，角材料 7.3

我正在嘗試調用函數並傳遞一些值，它提示以下錯誤

未找到 t1 的組件工廠。 你把它添加到@NgModule.entryComponents 了嗎？

盡管t1包含在entryComponent 。 但是一旦刪除傳遞值以修復值，它將起作用。

  <button mat-button (click)="openDialog('t1')">T1</button>
  <button mat-button (click)="openDialog('t2')">T2</button>

一旦我傳遞了值，它就會顯示上面的代碼。

  openDialog(e) {
    console.log(e);
    const dialogRef = this.dialog.open(e);
    dialogRef.afterClosed().subscribe(result => {
      console.log(`Dialog result: ${result}`);
      dialogRef == null
    });
  }

@Component({
  selector: 't1',
  templateUrl: 't1.html',
})
export class t1 {}

@Component({
  selector: 't2',
  templateUrl: 't2.html',
})
export class t2 {}

但是一旦我刪除了該值並修復了dialogRef.open ，它就可以正常工作

const dialogRef = this.dialog.open(t1);

Answer 1

這對我有用。 你也可以參考這個鏈接。 關聯

您可以使用dialogRef.componentInstance.myProperty = 'some data'來設置組件上的數據。

你可能需要這樣的東西：

 let dialogRef = this.dialog.open(DialogComponent, { disableClose: true, }); dialogRef.componentInstance.name = 'Sunil';

然后在你的 DialogComponent 你需要添加你的 name 屬性：

public name: string;

Answer 2

嘗試這樣的事情

constructor(
    public dialogRef: MatDialogRef<Component>,
    private dialog: MatDialog,
  ) { }


  openDialog(t1) {
    const dialogRef = this.dialog.open(NameComponent, {
      data: { t1 }
    });
    dialogRef.afterClosed().subscribe(data => {

  }

在對話框組件中檢索時

 @Inject(MAT_DIALOG_DATA) public data: any,

希望它有效

Answer 3

您應該發送一個變量而不是字符串。 它應該是t1而不是't1'

  <button mat-button (click)="openDialog(t1)">T1</button>
  <button mat-button (click)="openDialog(t2)">T2</button>

在你的 component.ts 中，你應該聲明組件

public t1 = new t1();
public t2 = new t2();

或者您可以使用template variables嘗試以下方法

  <t1 #test1></t1>
  <t2 #test2></t2>
  <button mat-button (click)="openDialog(test1)">T1</button>
  <button mat-button (click)="openDialog(test2)">T2</button>

Answer 4

openDialog(dialog : string) {
    if(dialog == "t1"){
     const dialogRef = this.dialog.open(t1,{ data: { "YOURVALUE" }});
     dialogRef.afterClosed().subscribe(result => { this.YOURVALUE = result; });
    }
    else {
     const dialogRef = this.dialog.open(t2,{ data: { "YOURVALUE" }});
     dialogRef.afterClosed().subscribe(result => { this.YOURVALUE = result; });
    }
}