img ng-srcを使用できません（imgのプロパティとして知られていないため、ng-srcにバインドできません）

Question

WebpackのAngularプロジェクトがあり、 SRCは、ここでは角度のドキュメントごと：

https://docs.angularjs.org/api/ng/directive/ngSrc

私はそうのような画像ソースで変数を持ってしようとしています：

<img ng-src="assets/images/{{row.imagePath}}.png" width="1" height="1" /> 

しかし、私はサーブNG実行したときに、私は次の取得しますブラウザコンソールのエラー：

zone.js:569 Unhandled Promise rejection: Template parse errors: 
Can't bind to 'ng-src' since it isn't a known property of 'img'. 

私はグーグルで、Angular + Webpackの問題なしでng-srcを使って他の人を見つけました。なぜこのプロジェクトではうまくいかないのか分かりません。ありがとうございました。

Answer 1

[attr.src]入力を使用して、ネイティブhtmlプロパティにバインドすることができます。あなたのcomponent.tsで

が

はあなたがタイプListItemの項目のリストを持っていると言うことができますファイル、ListItemクラスがimagePathプロパティを公開する必要があります。テンプレート

<div *ngFor="item in listItems"> 
    <img [attr.src]="item.imagePath" width="1" height="1" /> 
</div> 

ご希望の場合はそう

export class ListItem { 
    public imagePath: string; 
    // .... 
} 

@Component({ 
    templateUrl: './your/template/example.html', 
}) 
export class YourComponent { 
    listItems: ListItem[]; 
    //... 
} 

と同じようにこのことができます！