Warum kann ich keine Memberfunktion in ngFor aufrufen?

Question

ich habe:

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

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

Und in der Vorlage:

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

Warum funktioniert das nicht? Ich werde nur node_modules/@angular/core/bundles/core.umd.js:3076 TypeError: self.context.$implicit.formatName is not a function

Ich kann durch Bewegen der formatName() Funktion auf das übergeordnete Komponente dieses Problem umgehen und foo als Argument geben stattdessen this zu verwenden, aber es ist nicht das, was ich will:

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

Zugriff z.B foo.name auch direkt in der Schleife ganz gut funktioniert:

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

Offensichtlich meine Absicht, eine viel komplexere formatName() als in meinem Beispiel haben.

Answer 1

Funktionen/Methoden sollten nie in {{}} aufgerufen werden, da Angular2 diese Anweisungen bei jedem changeEvent aktualisiert.

Bessere Format Ihren Namen auf init oder wann immer Sie es formatiert werden müssen, in der Komponenten-Klasse und nur den Eigenschaftsnamen verwenden für {{}}