将变量保存在ngFor循环中，得到一个项目

Question

我很好奇，在*ngFor循环中保存一个变量的正确方法是什么，因为我不想调用一个函数几个时间效率的原因是什么，我试图做

例如：

<div *ngFor="let item of items; let i = index;" [ngClass]="{'alert':!getValue(item)}"> 
    <div *ngIf="!getValue(item)"> 
    alert 
    </div> 
    {{item}} 
</div> 

Answer 1

把你：什么我试图避免

<div *ngFor="let item of items; let i = index; let value = getValue(item)" [ngClass]="{'alert':!value}"> 
    <div *ngIf="!value"> 
    alert 
    </div> 
    {{item}} 
</div> 

例子转换为map函数，并返回每个项目的适当值。

function valueize(items: any[]): any[] { 
    return items.map(item => { 
     name: item.name, 
     description: item.description, 
     // etc... 
    }; 
} 

<div *ngFor="let item of valueize(items); let i = index;" [ngClass]="{'alert':!item}"> 
    <div *ngIf="!item"> 
    alert 
    </div> 
    {{item}} 
</div> 

您可能希望*ngFor之前，要做到这一点，即使是所谓的，所以你可以做*ngFor="let item of items"其中items每个item已经是正确的值。例如，您可以在构造函数或ngOnInit中执行此操作。

编辑：

正如ChrisG提到的，你可以让这个清洁剂，如果你已经这样做有你的getValue功能如下：

<div *ngFor="let item of items.map(getValue); let i = index;" [ngClass]="{'alert':!item}"> 
    <div *ngIf="!item"> 
    alert 
    </div> 
    {{item}} 
</div> 

这样你就不必创建全新的映射功能，您只需内联映射并为每个项目调用适配器功能，从而为每个item赋予合适的值。

Answer 2

没有办法做到你想要的。

你可以做的唯一的事情就是创建一个数组，将值存储在数组中，然后使用索引获取它们。喜欢的东西...

let data = []; 
. 
. 
. 
<div *ngFor="let item of items; let i = index" ngClass="{'alert':!data[i]}"> 
{{ data[i] = getValue(item) }} 
    <div *ngIf="!data[i]"> 
    alert 
    </div> 
    item 
</div> 

而且还是我不知道这是否会工作，角度不包换了这种东西，它是一个更容易将他们推向循环，像以前那样简单地分析你的价值观。 ...

<div *ngFor="let value of getItemValues(items); let i = index" [ngClass]="{'alert':!value}"> 
    <div *ngIf="!value"> 
    alert 
    </div> 
    {{value}} 
</div> 

其中getItemValues()将一次解析所有值。