在函数更改值后查看不更新

Question

我有一个删除标记的功能，这些标记添加到一个数组并从另一个数组中删除。这一部分都正常工作，但是当更新新值时，视图不会更新：

<div class="tag-wrapper mt-3">
    <span class="badge tag" *ngFor="let account of userForm.value.accountsToAdd">
        <span class="tag-title">{{ account.name }}</span>
        <button class="btn btn-secondary btn-sm" (click)="accountDelete(account.id, account.name)">
            <span class="fa fa-times"></span>
        </button>
    </span>
</div>

，模板是：

this.userForm.patchValue({accountsToAdd: accountsToAdd.filter(account => account.id !== id)});

应该注意，因为这涉及反应形式，我也尝试过：

  margin-top:auto;
  margin-botton:auto;

Answer 1

您将结果带到accountDelete方法内的变量，并且必须携带到范围

accountDelete(id, name) {
this.userForm.value.accountsToDelete.push(
    {
        id: id,
        name: name
    }
);
console.log(this.userForm.value.accountsToDelete);
this.userForm.value.accountsToAdd = this.userForm.value.accountsToAdd.filter(account => account.id !== id);
console.log(this.userForm.value.accountsToAdd);

}