Question

我有一个简单的表格，我使用ngFor来显示行。

app.component.html

<table>
    <thead>
        <tr>
            <th>Header 1</th>
        </tr>
    </thead>
    <tbody>
        <tr *ngFor="let item of items">
            <td>
                <a>{{myFunc(item?.id) ? "1" : "2"}}</a>
            </td>
        </tr>
    </tbody>
</table>

items是一个包含一个对象的列表。对于myFunc()列表中的一个对象，我希望items只能评估一次。但是，似乎myFunc()被称为 4次，我不知道为什么。

app.component.ts

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

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

  myFunc(itemId) {
    console.log("i was called");
    return true;
  }
}

显示此错误的演示：https://stackblitz.com/edit/angular-j7jgfl。＆＃34;我被称为＆＃34;被打印到控制台4次。任何人都可以告诉我为什么以及调用该函数的正确方法是什么？

Answer 1

这是您改进的代码，我不知道我做对了

 <tr *ngFor="let item of items">
            <td>
                <a>{{myFunc(item) ? "1" : "2"}}</a>
            </td>
        </tr>




myFunc(itemId) {
if(itemId){
console.log("i was called");
    return true;
}else{
return false;
}

  }

也许这会对你有所帮助

Angular - 为什么我的简单函数被多次调用？

1 个答案: