Javascript 如何将ngFor处理的列表中的项目与另一个具有ngIf的列表进行匹配

假设有一个如下所示的列表

items = [
  { id: 1,
    name: "one"
  },
  { id: 3,
    name: "thee"
  },
  { id: 5,
    name: "five"
  },
  { id: 6,
    name: "six"
  },
];

lists = [
  { id: 5,
    name: "five"
  },
  {
    id: 9,
    name: "nine"
  },
];

我希望仅当使用ngFor处理项目并且项目id包含在使用ngIf的列表中时，才显示项目。 但我不知道怎么做

<div *ngFor="let item of items">
  <p *ngIf = "How can I write it here?">
    {{ item.name }}
  <p>
<div>

{{item.name}

您可以使用来检查数组中是否存在项

<p *ngIf="lists.some(e => e.id === item.id)">

---

当

列表中的元素与
项
具有相同的
id
值时，
一些
将返回
true
。
您可以使用管道直接在
*ngFor
中过滤
项

在模板中：

<div *ngFor="let item of items | yourFilter:lists">
  <p>
    {{ item.name }}
  <p>
<div>

你能再解释一下如何使用列表吗？
@Pipe({name: 'yourFilter'})
export class YourFilterPipe implements PipeTransform {
  transform(items: object[], lists: object[]): object[] {
    return items.filter(item => {
      lists.some(e => e.id === item.id)
    });
  }
}