プロパティ 'p'は、 'trackBy'の 'T'型に存在しません

Question

私はプロジェクトを持っており、フロントエンドは@angular/cli: 1.1.3で開発されました。プロードモード（ng build -prod）でプロジェクトをコンパイルしようとするまで、すべてうまくいきました。私はtrackByトークンで*ngForディレクティブを使用し、私はこの

のようなエラーを得た場所で... SRC /アプリ/ app.component.ts.AppComponent.html（4,1​​1）：プロパティ 'P' んタイプ 'AppComponent'には存在しません。

「trackBy」を削除するとエラーが表示されなくなります。 空のプロジェクトでこのエラーを繰り返してここに貼り付けました。

AppComponentクラス宣言：

import {Component, OnInit} from '@angular/core'; 
import {Observable} from "rxjs/Rx"; 
@Component({ 
    selector: 'app-root', 
    template: ` 
    <ul> 
     <li *ngFor="let p of ppp | async;trackBy: p?.s"> 
     <h2>{{p.s}}</h2> 
     </li> 
    </ul>`, 
}) 
export class AppComponent implements OnInit { 
    ppp: Observable<any[]>; 
    constructor() { 
    } 
    ngOnInit() { 
    this.ppp = Observable.create((observer) => { 
     observer.next([{s: "0"}]); 
     setTimeout(function() { 
     observer.next([{s: "1"}, {s: "2"}, {s: "3"}]); 
     }, 2000); 
    }); 
    }  
} 

AppModuleクラス宣言：

import {BrowserModule} from '@angular/platform-browser'; 
import {NgModule} from '@angular/core'; 

import {AppComponent} from './app.component'; 

@NgModule({ 
    declarations: [ 
    AppComponent 
    ], 
    imports: [ 
    BrowserModule 
    ], 
    providers: [], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { 
} 

に成功ng build -prodを呼び出し、trackBy文を維持するためのアプローチがあります。

Answer 1

trackByは、コンポーネントの関数値のプロパティでなければなりません。 the documentationを読んでください。これは完全にはっきりしています。

が値を返すメソッドをコンポーネントに追加します。NgForが追跡する必要があります。

<li *ngFor="let p of ppp | async; trackBy: trackByS"> 
    <h2>{{p.s}}</h2> 
</li> 

public trackByS(p) { return p.s; } 

あなたのコードのtrackBy一部は実際にIBMアカデミーでコンパイルしていない場合でも、あなたはそれ思ったしませんでした。 trackBy: p?.sは存在しないコンポーネントのpというプロパティにアクセスしようとしたため無視されました。 AoTがテンプレートロジックをコンパイルするだけで、エラーが表示されます。