刪除formarray元素反應forms angular

Question

我正在嘗試從 angular 反應形式的 formArray 中刪除一個數組元素，因為我不想顯示空數組元素。 我需要刪除所有控件都包含 null 值或 false 的元素。 我不想刪除該元素，即使它的任何控件包含曾經指定的值以外的值。

this.accounts 是 formArray。 我正在嘗試使用 object.keys 但無法檢索不包含值的元素

我在下面嘗試了一些東西。 您可以...嗎

  if(this.readonly) {
      for (const control of this.accounts.controls) {
       const result  =  Object.keys(control).find((key) => (control[key] != null || true));
       if(!result) {
       // this.accounts.controls.splice();
       }
      }
    }

Answer 1

因為你已經有了控制權。 您可以訪問該控件上的值。

if(this.readonly) {
   for (const control of this.accounts.controls) {
     const result  =  control.value != null;
     if(!result) {
       // this.accounts.controls.splice();
     }
   }
}

也代替 splice()。 我建議在它自己的 formArray 上使用 removeAt() 。 https://angular.io/api/forms/FormArray#removeat

因為在拼接之后，您還必須調用 updateValueAndValidity 才能運行更改檢測。

Answer 2

(<FormArray>this.accounts).controls.forEach((el, i) => {
    if(el.value === null || el.value === false) {
(<FormArray>this.accounts.controls).removeAt(i);
 }
})