Angular 如何在div中关闭类似的[mat对话框]？

卡中有一个*ngFor，我需要在卡中单击后，在我的组件中获取所选数据

我尝试：

<div (click)="setProdutoEscolhido(data.produtos[i])" *ngFor="let produto of data.produtos; let i = index" class="card col-md-6">
   <div class="view overlay">
      <img *ngIf="produto.foto_prin_1 !=  null" class="card-img-top" src="{{produto.foto_prin_1}}"
       alt="Card image cap">
       <a href="#!">
          <div class="mask rgba-white-slight"></div>
       </a>
</div>

如果我这样做，我会收到：

错误：尝试区分“[object]”时出错。仅阵列和 不可抗力是允许的

如果我尝试在我的div中使用[mat dialog close]，我会收到：

“[mat对话框关闭]”这不是div的已知属性

如果我将div更改为按钮[mat dialog close]=“data.produtos[i]”，我可以获取数据，但是css会损坏

有一种方法可以在我的div中获得类似的[mat对话框关闭]

我正在使用此对话框：

@编辑：我将代码更改为：

 <div *ngFor="let produto of data.produtos; let i = index" class="card col-md-6" (click)="setProdutoEscolhido(produto)">

但现在我的console.log中没有定义：

  dialogRef.afterClosed().subscribe(result => {
    this.produtoAlvo = result;
    console.log(this.produtoAlvo);
  });

---

MatDialogClose

指令只能与

按钮

元素一起使用，但其输入选项（例如

[MatDialogClose]=“result”

）可以通过

DialogRef

使用

close（）

函数的

dialogResult

参数完成：

  dialogRef.afterClosed().subscribe(result => {
    this.produtoAlvo = result;
    console.log(this.produtoAlvo);
  });

setProdutoEscolhido(produto: any){
    this.data = produto;
    this.dialogRef.close(produto);
}

---

MatDialogClose

指令只能与

按钮

元素一起使用，但其输入选项（例如

[MatDialogClose]=“result”

）可以通过

DialogRef

使用

close（）

函数的

dialogResult

参数完成：

  dialogRef.afterClosed().subscribe(result => {
    this.produtoAlvo = result;
    console.log(this.produtoAlvo);
  });

setProdutoEscolhido(produto: any){
    this.data = produto;
    this.dialogRef.close(produto);
}