在Angular 2路由器的组件上添加模板引用可以通过以下步骤实现:
#
符号来定义。@ViewChild
装饰器来获取对该元素或组件的引用。@ViewChild
装饰器来将其与模板中的元素或组件关联起来。下面是一个示例:
在组件的模板文件中,假设有一个<app-child>
组件需要添加模板引用:
<app-child #childComponent></app-child>
在组件的类文件中,使用@ViewChild
装饰器来获取对该组件的引用:
import { Component, ViewChild } from '@angular/core';
import { ChildComponent } from './child.component';
@Component({
selector: 'app-parent',
template: `
<app-child #childComponent></app-child>
`
})
export class ParentComponent {
@ViewChild('childComponent') childComponent: ChildComponent;
}
在上面的示例中,@ViewChild('childComponent')
装饰器将childComponent
与模板中的<app-child>
组件关联起来。现在,可以在ParentComponent
类中使用this.childComponent
来访问ChildComponent
的属性和方法。
这样,你就成功在Angular 2路由器的组件上添加了模板引用。
领取专属 10元无门槛券
手把手带您无忧上云