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