angular - 在angular7中面临管道过滤器的问题
问题描述
由于找不到管道“shipperFinder”而面临错误*ngFor="let item of shipperList | shipperFinder : listsearch"
我已经创建了自定义管道作为声明数组部分的 app.module.ts 中声明的角度和管道类名称的语法。当我在中使用管道名称时
@Pipe({
name: 'shipperFinder'
})
在 html 代码中面临错误,因为找不到 shipperFinder 管道
<input type="text" name="search" placeholder="search here...." size="30" [(ngModel)]="listsearch">
<tr *ngFor="let item of shipperList | shipperFinder : listsearch">
<td>{{item.id}}</td>
<td>{{item.name}}</td>
<td>{{item.city}}</td>
<td>{{item.state}}</td>
<td>{{item.contact_no}}</td>
<td>{{item.email_id}}</td>
<td>
<a class="danger p-0" data-original-title="" title="" (click)="deleteuser(item.id)">
<i class="ft-x font-medium-3 mr-2"></i>
</a>
</td>
<td>
<a class="success p-0" data-original-title="" title="" (click)="editUser(item.id)">
<i class="ft-edit-2 font-medium-3 mr-2"></i>
</a>
</td>
</tr>
管道代码
import { Pipe, PipeTransform } from '@angular/core';
import { Shipper_master } from './shared/model/shipper.model';
@Pipe({
name: 'shipperFinder'
})
export class ShipperFinderPipe implements PipeTransform {
transform(value: Array<Shipper_master>, filterby : string): Shipper_master[] {
if(!value){
return [];
}
if(!filterby) {
return value;
}
filterby = filterby.toLocaleLowerCase();
return filterby ? value.filter((pro: Shipper_master) => pro.name.toLocaleLowerCase().includes(filterby)) : value;
}
}
然后在 app.module.ts 中添加管道类名称
declarations: [
AppComponent,
FullLayoutComponent,
ContentLayoutComponent,
GenerateBlComponent,
GenerateInvoiceComponent,
ShipperFinderPipe
],
解决方案
推荐阅读
- php - preg_match_all 从文件读取返回空数组
- python - 获取分组中具有最大值的行
- python - 将代理与 docker selenium python 一起使用不起作用
- sql - 如何根据日期列值的偏移量从表中仅获取一个条目
- search - 即使在我打开链接时加载 PDF 需要更多时间,谷歌如何如此快速地搜索 PDF?
- php - 使用 PHP 解析 DOMDocument 时出错
- java - getTableRow() 返回大于项目大小的索引
- r - 线性模型中交互项的影响
- javascript - 如何解决 Ajax 帖子类型跨域问题?
- azure - 应用程序设置键值对在 azure 中从暂存环境交换到生产