angular - Mat Dialog pass 数组

Question

当用户单击按钮以显示信息时，它会打开 mat 对话框。但是弹出是空白的，数据没有通过。

<form [formGroup]="userForm">
        <input type="text" formControlName="name" placeholder="Name" />
        <button class="ghost" (click)=onSubmit()>Click</button>
</form>

---

export class LoginComponent implements OnInit {

    data: User[] = [];
    
    constructor(private dialog: MatDialog) { }
    
    onSubmit() {
    this.registerService.getUser(this.name).subscribe((response: Array<User>) => {
      this.data = response;
    });
    
    return this.dialog.open(PopupRegisterComponent, {
      disableClose: true,
      autoFocus:true,
      data: this.data,
    });
}

---

export class PopupRegisterComponent implements OnInit {

  constructor(@Inject(MAT_DIALOG_DATA) public data: User) { }

  ngOnInit() {
    console.log( this.data.name );
    console.log( this.data);
  }
}

Answer 1

Subscribe是异步的，所以你需要在里面打开你的对话框：

onSubmit() {
  this.registerService.getUser(this.name).subscribe((response: Array<User>) => {
    this.data = response;
    
    // this.data isn't required here of course, depending on if you use these data elsewhere
    this.dialog.open(PopupRegisterComponent, {
      disableClose: true,
      autoFocus:true,
      data: this.data,
    });
});

你也不需要返回一些东西。除非您正在使用对话框 ref 进行处理，但我不这么认为。