개체에 값을 바인딩 할 선택 컨트롤을 만들고 변경하려고하면 선택한 개체에 액세스 할 수 있습니다.각도 2 RC4 - 선택 ngModel 지연된 업데이트
나는 이것이 사용자 오류 또는 버그 또는 가능하지 않은지 확실하지 않은 양식에 많은 변경 사항이 있음을 알고 있습니다. 지금까지 어디에 있어요 여기
이다 : 나는 일이하고 싶은 무엇 Link to Plunker
import { Component } from '@angular/core';
@Component({
selector: 'my-app',
template: `
<h1>My First Angular 2 App</h1>
<select (change)="onChange($event)" [(ngModel)]="selected">
<option value=''></option>
<option *ngFor="let d of data" [ngValue]="d">
{{d.name}}
</option>
</select>
`
})
export class AppComponent {
diagnostic;
selected;
data = [
{ id: 1 , name: 'query 1', filters: [
{ 'filter1': 'material = 1'},
{'filter2': 'plant = 2'}
]
},
{ id: 2 , name: 'query 2', filters: [
{ 'filter1': 'material = 1'},
{'filter2': 'plant = 2'}
]
}
];
onChange(event) {
console.log(event.target.value);
console.log(this.selected);
}
}
은 그 OnChange 이벤트 중 하나 내가 그에 선택한 항목의 개체 값을 전달하는 것이 호출 될 때 메서드를 사용하거나 ngModel에 바인딩 된 속성을 통해 선택한 값에 액세스 할 수 있습니다.
//expected
onChange(event) {
console.log(event.target.value) // selected object bound to ngValue
console.log(this.selected) // ngModel updated to object bound to selected option
}
하지만 불행하게도 event.target.value
는 객체와 작품의 this.selected
종류의 캐릭터 라인 버전 만 업데이트되고에 뒤에 항상이다.
다른 방법이나 적절한 방법이 있습니까? ngModel의 지연이 버그입니까?
도움이 될 것입니다.
<select [(ngModel)]="selected" (ngModelChange)="onChange()">
<option *ngFor="let d of data" [ngValue]="d">
{{d.name}}
</option>
</select>
을 다음 모델은 올바르게 속성에 적용됩니다
가 완전히 ... 내 응용 프로그램에 그것을 시도 작동하고 작동하지 않았다. 문제는 ngModel 및 ngModelChange의 순서입니다. '(ngModelChange) = "onChange()"[(ngModel)] = "선택한"은 작동하지 않습니다. 'onChange()'함수는 ngModel이 업데이트되기 전에 호출됩니다. 이것은 내가 그것을 다시 바꿀 때 항상 내가 그것을보고있는 것을보고 있었던 이유 다. 이 문제에 대한 메모로 답변을 업데이트 해 주시겠습니까? 또한 Angular Repo에 문제를 던질 예정입니다. 버그가 아니라면 분명히 어딘가에 문서화해야합니다. – ljaustin
이미 알려진 문제인 것처럼 보입니다. 이 stackoverflow 문제에 추가 할 것입니다. https://github.com/angular/angular/issues/3406 – ljaustin