* ng用于在angular2中运行无限循环 [英] *ngFor running an infinite loop in angular2

问题描述

我正在尝试使用以下代码使用angular2中的键渲染对象属性:

I am trying to render object properties using keys in angular2 using below code:

<ul>
    <li *ngFor="let element of componentModel | keys;let i=index">
      {{element.key}}--{{element.value}}  // 1---Bhushan...loaded only once
      <span  *ngIf="element">{{ loadProperty(i,element) }}</span>
    </li>
</ul>

但是我在这里面临一个问题.浏览器中的输出仅加载一次. 但是方法调用即loadProperty(i,element)在无限循环中运行.

But I am facing a problem here. The output in the browser in loaded only once. but the method call i.e. loadProperty(i,element) is running in an infinite loop.

loadProperty(i:number,element:any){       
    console.log(element.key+'========'+element.value);
    console.log(element);      
}

表示浏览器输出

(1 ---釜山)

(1---Bhushan)

仅显示一次，但在控制台上其无限运行，如下所示:

is displayed only once but on the console its running infinitely like below:

我只希望每个迭代调用一次此方法.

I want to call this method only once per iteration.

任何输入?

推荐答案

这只是工作中的Angular2更改检测，在每个更改检测周期中反复调用loadProperty(i,element).

This is just Angular2 change detection at work calling loadProperty(i,element) over and over in each change detection cycle.

不建议从模板中调用方法，因为它们经常被调用.您应该将结果存储在一个属性中，然后绑定到该属性.

Calling methods from the template is discouraged because they are called very often. You should instead store the result in a property and bind to this property instead.

这篇关于* ng用于在angular2中运行无限循环的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！