много лишнего для понимания. Написал прямо в телеграме, поэтому синтаксис может хромать
Родительский компонент:
@Component({...})
export class TestController {
this.allowed: number[] = [3, 5, 6];
isDisabled(number: number) {
return ! this.allowed.indexOf(number) > -1;
}
getTitle(number: number) {
return number % 2 === 0 ? Тултип для номера ${number} : '';
}
}
shared компонент, который используется в предыдущем и во многих других местах
@Component({
selector: 'numbers',
template: '<div *ngFor="let number of numbers" [class.disabled]="isDisabled(number)" [title]="getTitle(number)">{{ number }}</div><button type="button" (click)="change(10)"></button>'
})
export class NumbersController implements OnInit {
@Input() count: number = 10;
numbers: number[];
private _from: number = 0;
ngOnInit() {
this.updateRange();
}
change(step) {
this.from += step;
}
set from(value: number) {
this._from = value;
this.updateRange();
}
get from(): number {
return this._from;
}
updateRange(): number[] {
this.numbers = Array(this.numbers).map(i => i + this.from);
}
isDisabled(number) {
// Вот тут логика находится в клиентском коде. В ng1 я просто прокидывал callback через & и вызывал его тут, иногда кешировал при генерации. Но как сделать теперь?
}
getTitle(number) {
// И тут. Таких кейсов много
}
}
Если следовать правилам, то тебе нужен ControlValueAccessor https://angular.io/api/forms/ControlValueAccessor https://medium.com/@tarik.nzl/angular-2-custom-form-control-with-validation-json-input-2b4cf9bc2d73
Обсуждают сегодня