2017-11-15 12 views
1

개체 속성에 액세스하고 양식의 값을 바인딩하고 싶습니다. 지금까지 나는 다른 옵션을 시도했지만 성공하지 못했습니다.FormArray의 개체 속성에 액세스하고 각도 4의 값을 업데이트하십시오.

FormGroup : 이것은 내가 지금까지 내가 아래의 코드를 단순화 한 것입니다

this.form = this.fb.group({ 
    ingredients: new FormArray([this.fb.group({name: 'Pasta', price: ''})]) 
}) 

보기 코드 : 코드는 위의이 질문의 목적을 위해 단순화

<div formArrayName="ingredients"> 
    <ion-item *ngFor="let ingredient of form['controls'].ingredients['controls']; let i = index" padding-bottom> 
    <div [formGroupName]="i"> 
     <ion-input formControlName="price" type="number"></ion-input> 
    </div> 
    </ion-item> 
</div> 

, 시나리오가 다르긴하지만 끝 부분에서이 객체의 가격 값을 업데이트하려는 곳에서 끝납니다. 나는 나의 연구를하는 동안 그것을하는 많은 방법을 보았다. 그러나 아무것도 나를 위해 일하지 않는 것처럼 보인다.

+0

이 코드의 문제점은 무엇입니까? – Alex

답변

1

이 시도 : -

<form [formGroup]="form"> 
    <div formArrayName="ingredients"> 
    <div *ngFor="let ingredient of form['controls'].ingredients['controls']; let i = index" [formGroupName]="i"> 
    <input formControlName="price" type="number"/> 
    </div> 
    </div> 
    </form> 

및 TS : -

form: FormGroup; 

    constructor(builder: FormBuilder) { 
    this.form = builder.group({ 
     ingredients: new FormArray([ 
     builder.group({ 
      name: 'Pasta', 
      price: '', 
     }) 
     ]); 
    }) 
    } 

솔루션이 plunker을 확인하시기 바랍니다. http://plnkr.co/edit/it3VW8wvYfYmk2Ox6M60?p=preview