我有一個視頻陣列，它是回應陣列物件中的一個元素。現在我只想為每個回應標題回傳一個視頻，即，每場比賽應該只有一個精彩視頻。
這是我的終點
"response": [
{
"title": "Chelsea - Brighton",
"competition": "ENGLAND: Premier League",
"videos": [
{
"title": "Highlights",
"embed": "<div> A video 1<\/div>"
},
{
"title": "Highlights",
"embed": "<div> A video 2 <\/div>"
}
]
},
{
"title": "Brentford - Manchester City",
"competition": "ENGLAND: Premier League",
"videos": [
{
"title": "Highlights",
"embed": "<div> A video <\/div>"
}
]
}
}
我的模板
<div >
<div *ngFor="let video of result.videos">
<ng-container *ngIf="video.title == 'Highlights'">
<p [innerHTML]="video.embed | safe"></p>
<p>{{out.title}}</p>
</ng-container>
</div>
</div>
</div>```
I've tried ```<div *ngFor="let video of result.videos[0]"></div>``` But this gives only a single team result
uj5u.com熱心網友回復：
您可以創建一個管道來根據標題過濾視頻：
@Pipe({name: 'filterVideos'})
export class FilterVideosPipe implements PipeTransform {
transform(videos: any[], title: string): any {
return videos.filter(video => video.title === title);
}
}
然后將其用作：
<div *ngFor="let video of result.videos | filterVideos:'Highlights'; let index=index">
<ng-container *ngIf="index === 0">
<p [innerHTML]="video.embed | safe"></p>
<p>{{out.title}}</p>
</ng-container>
</div>
您可以隨時根據您的要求增強管道變換方法并使其通用。
為自定義資料轉換創建管道
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/398042.html