Mat-Dialog Angular

Question

我正在創建一個Dialog ，當我選擇一個值時，它將填充到input fields中，但現在我試圖在FormArray中創建一個hidden button ，當我選擇 true 時將顯示該按鈕，但如果我選擇 False 它不會顯示隱藏按鈕如何實現？

這是我到目前為止所做的

https://stackblitz.com/edit/mat-dialog-example-wvsgaj

Answer 1

我已經分叉了你的樣品。 看到這個。 https://stackblitz.com/edit/mat-dialog-example-gheonh

在item中添加了showButton屬性。

item(): FormGroup {
  return this.fb.group({
    qty: [10],
    total: [],
    showButton: false, // here
  });
}

然后在afterClosed中設置此屬性。

dialogRef.afterClosed().subscribe((result) => {
  const showButton = result.symbol;
  (this.fg.get('Info') as FormArray)
    .at(index)
    .get('showButton')
    ?.patchValue(showButton);
});

在 html 中，使用此值切換顯示或隱藏。

<button
  mat-raised-button
  color="primary"
  class="row"
  *ngIf="Info.get('showButton').value"
>
   TriggerButton
</button>