此类指令：
export class SuchDirective {
title = "SuchDirectiveTitle"
...
}
这样的组件导入这样的指令：
@Component({
directives: [SuchDirective]
})
export class SuchComponent {
title = "OverriddenDirectiveTitle" // not working
}
如何解决这样的问题？
您可以SuchDirective在@Input装饰器中添加一个参数：
@Directive({
selector: '[suchDirective]'
})
export class SuchDirective {
@Input('suchDirective') title: string;
...
}
然后更改标题，向其发送自变量，如下所示：
@Component({
directives: [SuchDirective],
template: `
...
<div [suchDirective]="'some str'">this one uses the string 'some str' as title</div>
...
<div [suchDirective]="title">this one uses the SuchComponent's title property</div>
...
`
})
export class SuchComponent {
title = "OverriddenDirectiveTitle"
}
对于每个注释，如果SuchDirective为@Component且具有模板：
@Component({
selector: 'such-directive',
template: `This is my title {{ title }}`
})
export class SuchDirective {
@Input() title: string;
}
并像这样使用它：
@Component({
directives: [SuchDirective],
template: `
...
Passing a fixed string as title:
<such-directive title="some str"></such-directive>
...
This one uses the SuchComponent's title property:
<such-directive [title]="title"></such-directive>
...
`
})
export class SuchComponent {
title = "OverriddenDirectiveTitle"
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句