import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy } from '@angular/core'; import { FormControl } from '@angular/forms'; import { Criterion, SelectCriterion } from '../../store/model'; import { Option } from '../../../metamodel/model'; @Component({ selector: 'app-select', templateUrl: 'select.component.html', changeDetection: ChangeDetectionStrategy.OnPush }) export class SelectComponent { @Input() id: number; @Input() label: string; @Input() options: Option[]; @Input() set criterion(criterion: Criterion) { this.getDefault(criterion); } @Output() add: EventEmitter<SelectCriterion> = new EventEmitter(); se = new FormControl(); addCriterion() { const option = this.options.find(o => o.value === this.se.value); const se = new SelectCriterion(this.id, option); this.add.emit(se); } getDefault(criterion: Criterion): void { if (!criterion) { this.se.reset(); this.se.enable(); } else { const c = criterion as SelectCriterion; this.se.setValue(c.option.value); this.se.disable(); } } }