【发布时间】:2018-02-27 14:08:00
【问题描述】:
我正在使用角度为 4 的 ngx-filter-pipe,但我遇到了这个问题。 我设法用一个值过滤,现在我试图用多个值过滤数据: 这是我得到的 这是我的组件:
@Component({
selector: 'deudas-list',
templateUrl: '../views/deudas-list.html',
providers: [ DeudaService ]
})
export class DeudasListComponent{
public titulo: string;
public deudas: Deuda[];
public userFilter: any = { mes: '' };
constructor(
private _route: ActivatedRoute,
private _router: Router,
private _productoService: DeudaService
) {
this.titulo = 'Listado de Pagos:';
}
ngOnInit() {
this._productoService.getDeudas().subscribe(
result =>{
console.log(result['Cuotas'].Cuota);
this.deudas = result['Cuotas'].Cuota;
},
error => {
console.log(<any>error);
}
);
}
}
这是我的看法
<div class="form-group has-feedback">
<label for="term" class="sr-only">Search</label>
<input type="text" name="term" [(ngModel)]="userFilter.mes" class="form-control" id="term" placeholder="Buscar por mes...">
<span class="glyphicon glyphicon-search form-control-feedback"></span>
</div>
<div *ngIf="deudas" class="table-responsive col-lg-12 tablilla">
<table class="table table-bordered table-striped table-responsive">
<tbody>
<tr *ngFor="let deuda of deudas | filterBy: userFilter | paginate: {itemsPerPage:10,currentPage: p}">
<td>{{deuda.nombre_edificio}}</td>
<td>{{deuda.numero_dpto}}</td>
<td>{{deuda.Annio}}</td>
<td>{{deuda.mes}}</td>
<td>{{deuda.nombre_tipo_cuota}}</td>
<td>{{deuda.monto_cuota}}</td>
<td>{{deuda.nombre_estado_cuota}}</td>
<td>{{deuda.fecha_pago}}</td>
</tr>
</tbody>
</table>
<pagination-controls (pageChange)="p = $event" class="paginador"></pagination-controls>
</div>
我尝试了多种方法,但无法成功 这是我正在关注的文档 https://github.com/VadimDez/ngx-filter-pipe 如图所示,我无法让 $ 或过滤器工作
这是我从 ws 获得的数据
您可以看到我使用 mes 进行过滤,但我想使用多个
<input type="text" name="term" [(ngModel)]="userFilter.mes" class="form-control" id="term" placeholder="Buscar por mes...">
任何帮助将不胜感激。
【问题讨论】:
标签: javascript angular typescript angularjs-filter