Angular 角管不能过滤每一列
我用的是角形管。我有一个表中显示的数组列表。我想筛选该表的每一列。我能够筛选表的前三列,但最后一列(容量)不起作用。它显示了错误。我认为字段可能是整数,这就是我出错的原因。请指导我如何解决这个问题 //ts文件Angular 角管不能过滤每一列,angular,angular-pipe,Angular,Angular Pipe,我用的是角形管。我有一个表中显示的数组列表。我想筛选该表的每一列。我能够筛选表的前三列,但最后一列(容量)不起作用。它显示了错误。我认为字段可能是整数,这就是我出错的原因。请指导我如何解决这个问题 //ts文件 campusFilter = ''; roomFilter = ''; roomTypeFilter = ''; capacityFilter = ''; roomInfoList: any = [ { id: 101, campus: 'Ashulia', room: '20
campusFilter = '';
roomFilter = '';
roomTypeFilter = '';
capacityFilter = '';
roomInfoList: any = [
{
id: 101,
campus: 'Ashulia',
room: '201AB',
roomType: 'Theory',
capacity: 30
},
{
id: 102,
campus: 'Dhaka',
room: '300',
roomType: 'Lab',
capacity: 35
},
{
id: 103,
campus: 'Khulna',
room: '300B',
roomType: 'Theory',
capacity: 50
},
{
id: 104,
campus: 'Khulna',
room: '102',
roomType: 'Lab',
capacity: 50
},
{
id: 105,
campus: 'Ashulia',
room: '201AB',
roomType: 'Lab',
capacity: 120
}
]
//管道过滤器文件
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'routineFilter'
})
export class ArrfilterPipe implements PipeTransform {
transform(value: any, filterString: string, propName: string): any {
if (value.length === 0 || filterString === '') {
return value;
}
const resultArray = [];
for (const item of value) {
if (item[propName] === null) {
} else if
(item[propName].toLowerCase().indexOf(filterString.toLowerCase()) !== -1)
{
resultArray.push(item);
}
}
return resultArray;
}}
//html文件
<table border="1">
<tr>
<td>
<input type="search" placeholder="Campus" name="campusFilter"
[(ngModel)]="campusFilter">
</td>
<td>
<input type="search" placeholder="Room" name="roomFilter"
[(ngModel)]="roomFilter">
</td>
<td>
<input type="search" placeholder="Room Type" name="roomTypeFilter"
[(ngModel)]="roomTypeFilter">
</td>
<td>
<input type="search" placeholder="Capacity" name="capacityFilter"
[(ngModel)]="capacityFilter">
</td>
</tr>
<tr>
<th>Campus</th><th>Room</th><th>Room Type</th><th>Room Capacity</th>
</tr>
<tbody>
<tr *ngFor="let roomInfo of roomInfoList | routineFilter: campusFilter:
'campus' | routineFilter: roomFilter: 'room'
| routineFilter: roomTypeFilter: 'roomType' | routineFilter:
capacityFilter: 'capacity' ">
<td>{{roomInfo.campus}}</td>
<td>{{roomInfo.room}}</td>
<td>{{roomInfo.roomType}}</td>
<td>{{roomInfo.capacity}}</td>
</tr>
</tbody>
</table>
校园房间类型房间容量
{{roomInfo.campus}
{{roomInfo.room}
{{roomInfo.roomType}
{{roomInfo.capacity}
我可以轻松地将int转换为string:
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'routineFilter'
})
export class ArrfilterPipe implements PipeTransform {
transform(value: any, filterString: string, propName: string): any {
if (value.length === 0 || filterString === '') {
return value;
}
const resultArray = [];
for (const item of value) {
if (item[propName] === null) {
} else if (item[propName].toString().toLowerCase().indexOf(filterString.toLowerCase()) !== -1) {
resultArray.push(item);
}
}
return resultArray;
}
}
这是一个愚蠢的错误,但我不能理解。顺便说一下,非常感谢你的合作