ngModel이 ngModel 인 동적 앵귤러 2 형식

사용자가 필요에 따라 더 많은 컨트롤을 추가 할 수있게 해주는 ngModel에 연결된 동적 양식을 만들려고합니다. 그냥 사진 울부 짖는 소리와 같은 :ngModel이 ngModel 인 동적 앵귤러 2 형식

는 이전 입력의 내용을 지 웁니다으로 컨트롤의 새로운 세트를 추가 할 때를 제외하고 예상대로 형태가 동작합니다. 모델은 변경되지 않더라도. 내가 말하는 행동을 설명하기 위해 이것을 plunkr으로 만들었습니다.

<tr *ngFor="let work of works; let i = index"> 
 
    <td> 
 
    <select required id="cliente" class="form-control" [(ngModel)]="work.operation" name="operation"> 
 
     <option>Operation 1</option> 
 
     <option >Operation 2</option> 
 
    </select> 
 
    </td> 
 

 
    <td> 
 
    <input required type="number" class="form-control" [(ngModel)]="work.cost" 
 
      name="cost"> 
 
    </td> 
 

 
    <td> 
 
    <input required id="horas_maquina_previstas" type="number" class="form-control" [(ngModel)]="work.hours" 
 
      name="hours"> 
 
    </td> 
 

 
    <td> 
 
    <button type="button" class="btn btn-danger btn-circle" (click)="removeWork(i)">Remove</button> 
 
    </td> 
 
</tr>

와 타이프 스크립트 구성 요소 정의 :

import {Component, ChangeDetectionStrategy} from '@angular/core' 

@Component({ 
    selector: 'my-app', 
    templateUrl: 'src/app.html' 
}) 
export class App { 
    works = []; 

    addWork(){ 
     this.works.push({}); 
    } 

    removeWork(index){ 
     this.works.splice(index, 1); 
    } 

    get diagnostic() { 
     return JSON.stringify(this.works); 
    } 
}

내가이 행동을 이해 할 수 없으며, 모든 관련

이

내가 쓴 HTML 템플릿입니다 내가 찾은 질문은 구형의 오래된 버전에 관한 것이었고 비슷한 문제는 없었습니다.

감사합니다.

출처

2016-07-28 Rafael Gil

컨트롤은 Angular2에서 제대로 작동하려면 고유 한 이름이 필요합니다. 다음을 수행하십시오.

<td> 
    <input required type="number" class="form-control" [(ngModel)]="work.cost" 
      name="cost-{{i}}"> 
</td>

출처

2016-07-28 14:42:15 Pace

ngModel이 ngModel 인 동적 앵귤러 2 형식

답변

관련 문제