爲什麼我不能在ngFor中調用成員函數？

export class Foo { 
    id: number; 
    name: string; 

    public formatName() : string { 
     return this.name; 
    } 
}

而且在模板：

<ul> 
    <li *ngFor="let foo of allFoos"> 
    <strong>{{foo.formatName()}}</strong> 
    </li> 
</ul>

爲什麼這不起作用？我就把node_modules/@angular/core/bundles/core.umd.js:3076 TypeError: self.context.$implicit.formatName is not a function

我可以解決此通過formatName()功能移動到母部件，並給予foo作爲參數，而不是使用this，但它不是我想要的：

<ul> 
    <li *ngFor="let foo of allFoos"> 
    <strong>{{formatName(foo)}}</strong> 
    </li> 
</ul>

訪問例如直接在環foo.name也工作得很好：

<ul> 
    <li *ngFor="let foo of allFoos"> 
    <strong>{{foo.name}}</strong> 
    </li> 
</ul>

顯然，我的目的是爲了有一個更復雜的formatName()一個比我的例子。

你能提供一個Plunker？理解代碼的哪部分是什麼組件以及它們如何相關是非常麻煩的。 –

或者更好的是，在這裏有一個Stack Snippet（'[<>]'工具欄按鈕）。 –

其中allFoos是定義的。如果這個模板對應於Foo組件，那麼Foo必須有一個** private allFoos：Foo []; ** – kimy82

函數/方法幾乎不應該在{{}}中調用，因爲Angular2會更新每個changeEvent上的那些語句。

更好的格式您的初始化名字或當你需要格式化它，在你的組件類，並只使用屬性名稱{{}}

2016-12-01 12:11:15 lastWhisper

回答