2
I tried to deploy a filter pipe but realized two wrong behaviors.
Having two elements in my table:
sfafasf:150,00 and other variable cost: 80,00
When you put the name "other variable cost" in the filter field, the first row of the column disappears as expected, but the column that remained has the fields "value" and "maturity" of the other field:
Table without the filter:
When searching for "other", the search columns are wrong:
And then the checkbox you were checking takes uncheck:
Part of the template responsible for the filter:
<input #myInput [(ngModel)]="query" type="text" class="form-control" name="filtra" id="filtra" />
<tr *ngFor="let custofixo of custosFixos | search:'nome':query; let i = index;">
<td scope="row">
<div class="custom-control custom-checkbox">
<input (click)="OnCheckboxSelectCustoFixo(i,$event)" type="checkbox"
class="custom-control-input" id="custosFixos{{i}}">
<label class="custom-control-label" for="custosFixos{{i}}">
</label>
</div>
</td>
<td>{{custofixo.nome}}
</td>
<td>
<input currencyMask [options]="{ nullable: true, prefix: 'R$ ', align: 'left', thousands: '.', allowNegative: false, allowZero: false, decimal: ',' }" name="valorcustofixo{{i}}" [(ngModel)]="custosFixos[i].valor" type="text"
id="inputvalorcustofixo{{i}}" class="form-control tableinput">
</td>
<td>
<input name="vencimento_padraocustofixo{{i}}" mask="00/00/0000" [(ngModel)]="custosFixos[i].vencimento_padrao"
name="vencimento_padrao{{i}}" type="text" id="inputvencimentopadraocustofixo{{i}}" class="form-control tableinput">
</td>
</tr>
</tbody>
</table>
My pipe:
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'search'
})
export class SearchPipe implements PipeTransform {
public transform(value, keys: string, term: string) {
if (!term) return value;
return (value || []).filter((item) => keys.split(',').some(key => item.hasOwnProperty(key) && new RegExp(term, 'gi').test(item[key])));
}
}
I found a mistake only, I don’t know if it was on purpose: the last
<input
has twoname
s. It would not be{{custosFixos[i].nome}}
?– Gaspar
That wasn’t it, I got it sorted out, I’ll post the answer here.
– veroneseComS
I’m glad you solved it. A tip: Use
trackBy
to increase the performance of your filter. More info here– Gaspar