无法阅读财产'数据'未定义 - 在子formArray中使用patchValue

时间:2018-01-30 13:24:31

标签: angular typescript

我尝试通过选择选择框动态渲染cat_name。但是我无法使用patchValue渲染cat_name。下面是我渲染子formArray的代码。

通过选择使用更改事件的选择框,我得到了基于值的名字,我已经过滤了json数组,我得到了特别的formarray。

它有数据formArray我试图在选择选择框时呈现cat_name但我没有得到。以下是我的代码



selectarch(cat){

this.test=this.users.filter(data =>data.firstname === cat.target.value);

let arr = <FormArray>this.myForm.controls.users;

arr.controls[0].patchValue({firstname:this.test[0].firstname,lastname:this.test[0].lastname,street:this.test[0].street});

let arr2 = <FormArray>this.myForm.controls.users[0].data;
arr2.controls[0].patchValue({cat_name:this.test[0].data[0].cat_name});

}
&#13;
<select (change)="selectarch($event)">
<option>Select</option>
<option [value]="res.firstname" *ngFor="let res of users">{{res.firstname}}</option>
</select> 
&#13;
&#13;
&#13;

以下是我的CODE网址 CODE URL

以下是json用户数组。

&#13;
&#13;
users = [ { "firstname": "ramu", "lastname": "mothukuri", "city": "chennai", "street": "ramu sivan koiil street", "pin": "600024",
  "data":[{"cat_id":"1","cat_name":"yyy","category":"rrr"},{"cat_id":"2","cat_name":"zzz","category":"222"}] },
  { "firstname": "ravi", "lastname": "mothukuri", "city": "chennai", "street": "ravi sivan koiil street", "pin": "600024","data":[{"cat_id":"1","cat_name":"ddd","category":"aaa"},{"cat_id":"2","cat_name":"aa","category":"333"}] },
  { "firstname": "manu", "lastname": "mothukuri", "city": "chennai", "street": "manu sivan koiil street", "pin": "600024","data":[{"cat_id":"1","cat_name":"jjj","category":"999"},{"cat_id":"2","cat_name":"bbb","category":"666"}] }
  ]
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:1)

你应该获得数据formarray来修补cat_name的值

试试这个

const users = this.myForm.get(['users', 0, 'data']) as FormArray;

users.controls[0].patchValue({cat_name:this.test[0].data[0].cat_name});

Working example

答案 1 :(得分:0)

let users = <FormArray>this.myForm.get('users');
// users is the FormArray as I understood from your code
users.at(0).get('data').patchValue({cat_name:this.test[0].data[0].cat_name});
// at(0) will give the formGroup at index 0 of formArray
// get('data') to get formControl of formGroup

您的formGroup就像:

this.fb.group({
    users: this.fb.array([fb.group({
                firstname: this.users[0].firstname,
                lastname: this.users[0].lastname,
                street: this.users[0].street,
                data: dataArr
    })])
})