Мне нужна помощь с этим select
, он заполнен базой данных, и мне нужно выбрать элемент при его изменении.
<select class="custom-select col-md-12" id="operation" name="operation" formControlName="operation">
<option *ngFor="let operation of operations" [ngValue]="operation.id" (ngModelChange)="show(operation)">{{ operation.value}}</option>
</select>
show(value){
...
}
Я уже пробовал с (change)
и [(ngModel)]
, но это не работает.
0
LeoHenrique
29 Май 2019 в 20:08
2 ответа
Лучший ответ
Событие изменения должно быть в теге <select>
:
<select class="custom-select col-md-12" id="operation"
(ngModelChange)="show($event)" name="operation" formControlName="operation">
<option *ngFor="let operation of operations" [ngValue]="operation.id" \>
{{ operation.value}}
</option>
</select>
1
Arun
29 Май 2019 в 17:15
Если вы связываете formcontrolName, вам не нужно связывать событие изменения в html. Вы можете подписаться на событие изменения в самой TS. Но если вы хотите связать событие изменения через html, удалите привязку formcontrolName и событие изменения связывания в html.
Компонент
import { Component } from '@angular/core';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
name = 'Angular';
operations = [{ id: 1, value: 'test' }, { id: 2, value: 'test2' }, { id: 3, value: 'test3' }];
show(event){
console.log(event.target.value);
}
}
<select class="custom-select col-md-12" id="operation" name="operation" (change)="show($event)">
<option *ngFor="let operation of operations" [value]="operation.id" >{{ operation.value}}</option>
</select>
Пример: StackBlitz
0
Ravin Singh D
29 Май 2019 в 17:18
Похожие вопросы
Новые вопросы
angular
Вопросы по Angular (не путать с AngularJS), веб-фреймворку от Google. Используйте этот тег для угловых вопросов, которые не относятся к конкретной версии. Для более старой веб-платформы AngularJS (1.x) используйте тег angularjs.