如何通过过滤器显示特定值

How to display particular value via filter?

本文关键字：显示 何通过 过滤器      更新时间：2024-01-24

我的应用程序中有这样的数据：

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>

我怎样才能以正确的方式做到这一点？感谢

您可以通过以下方式更新管道：

@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.

相关文章：