Question

那么这是否意味着我们不会享受双向绑定的魅力？

例如：在NG6中，我有一个客户列表（custList），它创建了一个反应形式，并且ngModel用于2向数据绑定。从UI更改特定客户的属性时，它也反映在custList中。 NG6的角度代码如下；

在我的组件中；

let custForm: FormGroup;
let custFormArray = new Array();

custList.forEach(cust => {
 custFormArray.push(new FormGroup({
    id: new FormControl(cust .id),
    name: new FormControl(cust.name, [Validators.required])
  }));
});

this.custForm = this.fb.group({
  custFormArray: this.fb.array(custFormArray)
});

在我的模板中；

<div *ngIf="custList?.length > 0" [formGroup]="custForm">
  <div formArrayName="custFormArray">
    <div *ngFor="let cust of custList; let i=index">
      <div [formGroupName]="i">
       <input formControlName="id" [(ngModel)]="cust.id">
       <input formControlName="name" [(ngModel)]="cust.name">
      </div>
    </div>
   </div>
</div>

新方法：（无ngModel绑定）

<div *ngIf="custList?.length > 0" [formGroup]="custForm">
 <div formArrayName="custFormArray">
  <div *ngFor="let cust of custList; let i=index">
    <div [formGroupName]="i">
       <input formControlName="id">
       <input formControlName="name">
    </div>
  </div>
 </div>
</div>

当我使用上述方式时，从UI进行的更改不会传播custList，这会破坏双向数据绑定模型。我只能通过以下方式访问更改；

let customerList =Object.assign({}, this.custForm.value.custFormArray) as   Array;

let specificCustomer = customerList[specificCustomerIndex];

其中custForm是formName，custFormArray是表单数组。

意味着我想在任何地方访问修改后的列表都需要做同样的事情。

有人可以回答我这是否是新版本中有意的吗？

ngModel与formControlName在相同的表单字段上。支持使用ngModel输入属性和ngModelChange事件以及已弃用的反应形式

0 个答案: