Question

我试图获得一种仅在加载后在组件内调用函数的方法，只要加载了组件，多次调用了我的函数，而我却不想这样做，这是我的代码：

<div class="form-group" [ngClass]="aplicaCssErro('name')">
    <label>
        NAME
    </label>
    <input class="form-control" type="text" formControlName="name" autocomplete="off">
</div>

我的功能：

verificaValidTouched(campo){
   return !this.formulario_cadastro.get(campo).valid  && this.formulario_cadastro.get(campo).touched;
}

aplicaCssErro(campo){
    console.log(this.verificaValidTouched(campo));

   return{
     'has-error': this.verificaValidTouched(campo),
     'has-feedback': this.verificaValidTouched(campo)
   }
}

这些功能仅用于以我的数据驱动形式添加一个验证类。我想要的是在加载页面后或在此之后做的更好的事情就是调用HTML中的那些函数，因为在加载页面时，这些函数会被调用多次。谁能告诉我解决方案？

Answer 1

您应该使用Angular生命周期挂钩（可能是ngAfterViewInit）在页面完成初始化之后调用函数。

https://angular.io/api/core/AfterViewInit

生命周期挂钩是利用Angular API的好方法：

https://angular.io/guide/lifecycle-hooks

Angular组件上的功能问题

1 个答案: