我的应用中有这样的数据:
birthdayGreetings:Array<any> = [
{
name: 'John',
date: new Date(1994, 3, 19),
greeting: 'Happy Birthday, John! Good luck!',
displayName: false
}
];
我需要在本周发布日期时才显示NAME,所以我这样做:
export class ThisWeekPipe {
transform(myArr) {
var result = myArr.filter(
item => {
var day = item.date.getDate();
if(day >= 4 && day <= 10) {
item.displayName = true;
return true;
}
}
);
return result;
}
}
但是我总是得到相同的结果(只是数组元素可以使用该过滤器)
这是html:
<ul>
<li *ngFor="#manBirthday of birthdayGreetings | thisWeekPipe">
{{ manBirthday }}
</li>
</ul>
我怎样才能以正确的方式做到这一点?谢谢
答案 0 :(得分:2)
您可以通过这种方式更新管道:
@Pipe({
name: 'thisWeekPipe'
})
export class ThisWeekPipe {
transform(myArr) {
return myArr.filter(item => {
var day = item.date.getDate();
return (day >= 4 && day <= 10);
}).map(item => item.name);
}
}
首先过滤列表以仅获取与日期条件匹配的元素,然后仅使用name
属性。这样,您只能获得要在ngFor
循环中显示的名称列表。
请参阅此plunkr:https://plnkr.co/edit/6VHtFp4zvvMdm3rXbFOP?p=preview。