https://angular.io/api/core/ViewChild показывает пример связывания дочернего объекта через объект.Скопируйте код здесь, в случае, если ссылка станет недействительной в будущем:
Вы можете использовать ViewChild, чтобы получить первый элемент или директиву, соответствующую селектору, из DOM представления.Если DOM представления изменяется, и новый дочерний элемент соответствует селектору, свойство будет обновлено.
Запросы представления устанавливаются до вызова обратного вызова ngAfterViewInit.
Свойства метаданных:
селектор - тип директивы или имя, используемое для запроса.read - прочитать другой токен из запрашиваемых элементов.
import {Component, Directive, Input, ViewChild} from '@angular/core';
@Directive({selector: 'pane'})
export class Pane {
@Input() id: string;
}
@Component({
selector: 'example-app',
template: `
<pane id="1" *ngIf="shouldShow"></pane>
<pane id="2" *ngIf="!shouldShow"></pane>
<button (click)="toggle()">Toggle</button>
<div>Selected: {{selectedPane}}</div>
`,
})
export class ViewChildComp {
@ViewChild(Pane)
set pane(v: Pane) {
setTimeout(() => { this.selectedPane = v.id; }, 0);
}
selectedPane: string = '';
shouldShow = true;
toggle() { this.shouldShow = !this.shouldShow; }
}