Когда это изменение отражается на модели в Angular2 select

58
5

У меня есть поле выбора, подобное этому:

<div *ngFor="let filter of filters; let idx = index">
<select [id]="'name' + idx" [(ngModel)]="filter.name" (change)="changeFilter(idx, $event)">
<option val="a">A</option>
<option val="b">B</option>
</select>
</div>

Моя функция change() на компоненте не обнаруживает изменения мгновенно. Упрощенная:

@Component()
export class Filters {

public filters = [{name: "a"}, {name: "b"}, {name: "a"}];

public change(idx: number, $event: Event) {

console.log(this.filters[idx].name === $event.target.name); // false here
setTimeout(() => {

console.log(this.filters[idx].name === $event.target.name); // Now it true

}, 10);
}
}

Теперь, если я переключаюсь между параметрами, функция change() требует некоторое время - обычно менее 3 миллисекунд в этом setTimeout, но иногда больше.

Теперь я уверен, что это не лучший способ обнаружить изменения, и я узнаю, как это сделать правильно, но мне любопытно узнать, как определить, когда изменение отразилось на моей модели?

спросил(а) 2016-06-16T12:24:00+03:00 4 года, 5 месяцев назад
1
Решение
72

ngModel не поддерживает привязку к переменным, созданным ngFor.

Используйте вместо этого

[(ngModel)]="filters[idx].name"

Вы также можете попробовать

(ngModelChange)="changeFilter(idx, $event)"

ngModelChange, вероятно, ngModelChange после изменения значения, в то время как для (change) он зависит от браузера, какое обработчик событий и событий обрабатывается первым (AFAIR ngModel использует input)

ответил(а) 2016-06-16T12:29:00+03:00 4 года, 5 месяцев назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема