为什么插值表达式多次执行?

时间:2017-12-29 17:10:23

标签: angular

这是一个简单的Angular4应用程序。 我正在使用插值调用方法。它被执行了4次。

app.component.ts

import { Component} from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 1;



 testing(){
     console.log('IN testing 0');

 }

 private testing1(){
    console.log('IN testing 1');
 }
}

app.component.html

<h2>{{testing1()}}</h2>
<button (click)="testing()">Testing2 </button>

当页面加载时,它会打印“IN testing 1”4次。当我单击按钮时,它会两次打印“IN testing 1”。我无法理解这一流程。

1 个答案:

答案 0 :(得分:0)

当您在每个更改检测中调用此<h2>{{testing1()}}</h2>函数时,testing1()函数将被触发。这就是为什么它的打印控制台多次。这是一个坏习惯。而不是使用函数使用变量