Question

我一直在尝试为我的项目构建一个过滤管道，它过滤掉一串字符串。它工作正常，但我仍然收到错误。我不知道这是为什么？我还想问一下是否有办法让过滤器更通用，所以我可以将它用于其他字符串。

这是管道：

import { Pipe, PipeTransform } from '@angular/core';
import {Afdelingen} from "../models";

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

  transform(afdeling:Afdelingen[]) {
    return afdeling.filter(afd => afd.afdelingsNaam == 'pediatrie');
    }
}

我的HTML只是用于测试，但在这里：

<div *ngFor="let afd of afdeling | filter">
  {{afd.afdelingsNaam}}

</div>

我还添加了一张图片，以便您可以看到，它正在运行，但我收到了错误消息。 Error

编辑：通用搜索管道：

import { Pipe, PipeTransform } from '@angular/core';
import {Afdelingen} from "../models";

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

  transform(afdeling:Afdelingen[], value:string) {
    if (!afdeling)
      return afdeling;
    return afdeling.filter(afd => afd.afdelingsNaam == value);
  }
}

Answer 1

您可以在管道中添加此项检查：

transform(afdeling:Afdelingen[]) {
    if (!afdeling)
        return afdeling;
    return afdeling.filter(afd => afd.afdelingsNaam == 'pediatrie');
}

所以你摆脱了异常

Answer 2

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
   name: 'filterbytag'
 })
export class FilterbytagPipe implements PipeTransform {

transform(items: any[], searchText: string): any[] {
if (!items) return [];
if (!searchText) return items;
searchText = searchText.toLowerCase();
  return items.filter(it => {
  return it.toLowerCase().includes(searchText);
  });
}
}

Angular2：FilterPipe：无法读取属性＆＃39; filter＆＃39;未定义的

2 个答案: