我在具有数据源的角度材料表中有这个表格组;
<ng-container matColumnDef="fr">
<th mat-header-cell *matHeaderCellDef> Family Rel. </th>
<td mat-cell *matCellDef="let element">
<mat-form-field color="warn" appearance="outline">
<mat-label>Family Relation</mat-label>
<mat-select id="family_relation" formControlName="family_relation" placeholder="Family Relation">
<mat-option *ngFor="let familyRelation of familyRelationArray; let i = index" [value]="familyRelation.family_relation_id">
{{familyRelation.family_relation_type}}
</mat-option>
</mat-select>
</mat-form-field>
{{element.fr}}
</td>
</ng-container>
我从这个方法得到 familyRelationArray
:
getFamilyRelation() {
let status = 'Active';
this.auth.getFamilyRelation(status).subscribe(
(data) => {
this.familyRelationArray = data;
},
(error) => {
console.log(error);
}
);
}
对于材料表中显示的每一行,它们是不同的族关系 .
我正在使用以下内容显示数据:
getData()
{
this.auth.getIndPerHousehold(this.hh_id).subscribe(
(data)=>{
if(data=="empty")
{
this.showEmpty = true;
}
else
{
this.showEmpty = false;
this.dataSource = new MatTableDataSource(Object.values(data));
this.resultsLength = Object.values(data).length;
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
// this.formGroup.controls['family_relation'].setValue(Object.values(data[0]['frid']));
Object.values(data).forEach(element => {
//console.log(element.frid)
this.formGroup.get('family_relation').setValue(element.frid);
});
}
},
(error)=>
{
console.log(error);
}
);
}
我使用以下内容来选择家庭中每个人的对应关系:
Object.values(data).forEach(element => {
//console.log(element.frid)
this.formGroup.get('family_relation').setValue(element.frid);
});
表中显示的是常规数据,但下拉列表选择的最后导入值为 element.frid
.
所以最后一行是一个孩子,所有下拉列表都选择 child
.
请注意 frid
与family_relation_id相同 .
如何在数据源订阅结果中运行循环让下拉列表选择每行的确切值?