[英]Angular TemplateRef ExpressionChangedAfterItHasBeenCheckedError
just playing around with TemplateRef 只是在玩TemplateRef
so I've set up this simple code 所以我设置了这个简单的代码
and in the chrome console I've got 在chrome控制台中
ERROR Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was cheched 错误错误:ExpressionChangedAfterItHasBeenCheckedError:表达式被检查后已更改
I can see the point if inside ng-template 我可以看到ng-template里面的意思
would be a ngModel as in this post 将是本文章中的ngModel
Angular - Exception when adding dynamic component Angular-添加动态组件时发生异常
but with simple binding ..... 但具有简单的绑定.....
@Component({
selector: 'app-root',
template: `
<ng-template #myTemplate>
<button class="tab-button"
(click)="login()">{{loginText}}</button>
<button class="tab-button"
(click)="signUp()">{{signUpText}}</button>
</ng-template>
`
})
export class AppComponent implements AfterViewInit, AfterContentInit {
@ViewChild('myTemplate') tmpl: TemplateRef<any>;
loginText = 'Login';
signUpText = 'Sign Up';
constructor(private view:ViewContainerRef){}
login() {
console.log('Login');
}
signUp() {
console.log('Sign Up');
}
ngAfterViewInit(): void {
this.view.createEmbeddedView(this.tmpl)
}
ngAfterContentInit(): void {
// It doesn't work either
//this.view.createEmbeddedView(this.tmpl);
}
}
Thanks in advance 提前致谢
Since #myTemplate
is static view query you can use ngOnInit
hook 由于#myTemplate
是静态视图查询,因此可以使用ngOnInit
钩子
ngOnInit(): void {
this.view.createEmbeddedView(this.tmpl)
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.