Question

我是Angular 5的新手，我需要将表单控件与其他字段一起循环。在循环DIV部分时，我需要为表单控件设置不同的值。

这里有员工姓名及其职位列表。使用* ng循环JSON数据时，我需要为每个员工设置不同的职位。

HTML。

 <div class="col-sm-12" *ngFor='let positionsEMP of Response'>

  <h6>{{positionsEMP?.Name}}</h6>

  <form [formGroup]="Employees" >
    <mat-form-field>
      <mat-label>Position</mat-label>
      <mat-select  placeholder="position"
        formControlName="position">
        <mat-option>Select</mat-option>
        <mat-option *ngFor="let pos of POSITION" [value]="pos?.Id">{{pos?.Name}}
        </mat-option>
      </mat-select>
      <mat-error *ngIf="Employees.get('position').hasError('required')">
        EMployee name is must.
      </mat-error>
    </mat-form-field>
  </form>

  <button  class="col-sm-12" mat-flat-button (click)=Action(positionsEMP?.ID,Employees.value)>Update</button>
</div>

在这里，我想为各个员工的表单控件设置不同的值。

TS。

Answer 1

在打字稿中，您可能有：

this.Employees = this.fb.group({
"ID"       : [""],
"position" : [""]
})

如果要在单击更新时更改formControlName的值，请执行以下操作：

Action(id,value)
{
 this.Employees.controls["ID"].setValue(id); 
 this.Employees.controls["value"].setValue(value);
}

注意：

变量名和方法名应始终以小写字母开头，请检查：camelCase

在Angular 5中循环（* ngFor）时是否可以为同一formcontrol设置不同的值

1 个答案: