Angular TemplateRef ExpressionChangedAfterItHasBeenCheckedError

Question

spielen nur um mit TemplateRef

so habe ich diesen einfachen Code einrichten

und in der Chromkonsole habe ich

ERROR Fehler bekam: ExpressionChangedAfterItHasBeenCheckedError: Expression hat sich geändert nachdem es cheched wurde

Ich kann den Punkt sehen, wenn innerhalb ng-Vorlage

würde

Angular - Exception when adding dynamic component

aber mit einfachen Bindung .....

@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); 
    } 
} 

Vielen Dank im Voraus

Answer 1

Da #myTemplate ist statische Sicht Abfrage Sie eine ngModel wie in diesem Beitrag sein kann ngOnInit verwenden hook

ngOnInit(): void { 
    this.view.createEmbeddedView(this.tmpl) 
}