Angular 使用管道过滤帖子

Question

我正在尝试使用管道过滤 Angular 中 table 的帖子，但我一直在控制台上收到此错误：core.js:12689 无法绑定到'ngForFilter' 因为它不是 'a' 的已知属性。

我认为错误出在 filter:filterPost 上，但不知道如何解决。有什么线索吗？

我的 html 代码如下。

<div class="form-group">
    <label for="exampleFormControlInput1">Busca un reporte</label>
    <input type="text" class="form-control" id="exampleFormControlInput1" name="filterPost" placeholder="Busca.." [(ngModel)]="filterPost">
  </div>
<a *ngFor="let report of All_reports | paginate: { itemsPerPage: 10, currentPage: actualPage }; let i = index; 
filter: filterPost" class="list-group-item list-group-item-action flex-column align-items-start" [routerLink]="['/reporte-admin']" 
routerLinkActive="router-link-active" (click)="onSubmit(report._id)">

    <div class="d-flex w-100 justify-content-between">
        <h5 class="mb-1">Reporte #: {{report._id}}</h5>
        <small>{{i+1}}</small>
    </div>
      <p class="mb-1">Comentario: {{report.comentario}}</p>
      <small class="text-muted">Nombre: {{report.nombre}} {{report.apellido}}</small>
</a>
<br>

这是我的 filter.pipe.ts 代码：

@Pipe({
  name: 'filter'
})
export class FilterPipe implements PipeTransform {

  transform(value: any, arg: any): any {
    const resultPosts = [];
    for(const report of value){
      if(report._id.indexOf(arg) > -1){
        resultPosts.push(report);
      };
    };
    return resultPosts;
  }

}

Answer 1

管道运算符“|”需要在它的左边有一些值。在您的情况下，您在 let i=index;

之后的末尾添加了管道运算符

我相信你应该这样做

*ngFor="let report of All_reports | paginate: { itemsPerPage: 10, currentPage: actualPage } | filter: filterPost; let i = index;"

并且不要忘记在应用程序模块中添加 declarations

Angular 使用管道过滤帖子

Angular filter posts using pipes

html

angular

pipe

ngfor