update
This commit is contained in:
@@ -5,8 +5,17 @@ import { Pipe, PipeTransform } from '@angular/core';
|
|||||||
})
|
})
|
||||||
export class FilterPokemonPipePipe implements PipeTransform {
|
export class FilterPokemonPipePipe implements PipeTransform {
|
||||||
|
|
||||||
transform(value: unknown, ...args: unknown[]): unknown {
|
transform(pokes: any[], property?: string, searchString?: string): any {
|
||||||
return null;
|
if(typeof searchString == 'undefined'){
|
||||||
|
return pokes;
|
||||||
|
}
|
||||||
|
else if (typeof pokes !== 'undefined' && typeof property !== 'undefined') {
|
||||||
|
return pokes.filter((poke) => {
|
||||||
|
return poke[property].toLowerCase().indexOf(searchString.toLowerCase()) !== -1;
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
return [];
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -4,10 +4,14 @@
|
|||||||
|
|
||||||
<BR>
|
<BR>
|
||||||
id : {{id}}
|
id : {{id}}
|
||||||
|
<BR>
|
||||||
|
<input [(ngModel)]="searchPokeName">
|
||||||
|
<BR>
|
||||||
|
|
||||||
<select [(ngModel)]="selectedPokeId">
|
<select [(ngModel)]="selectedPokeId">
|
||||||
<option [value]="poke.id" *ngFor="let poke of pokes"> {{poke.name}}</option>
|
<option [value]="poke.id"
|
||||||
|
*ngFor="let poke of pokes | filterPokemonPipe:'name':searchPokeName">
|
||||||
|
{{poke.name}}</option>
|
||||||
</select>
|
</select>
|
||||||
<ul>
|
<ul>
|
||||||
<li *ngFor="let poke of pokes; index as i">{{poke.name}}</li>
|
<li *ngFor="let poke of pokes; index as i">{{poke.name}}</li>
|
||||||
|
|||||||
@@ -10,6 +10,7 @@ import { Pokemon } from '../pokemon';
|
|||||||
export class MyComponentComponent {
|
export class MyComponentComponent {
|
||||||
id: string;
|
id: string;
|
||||||
selectedPokeId : string;
|
selectedPokeId : string;
|
||||||
|
searchPokeName: string;
|
||||||
|
|
||||||
pokes : Pokemon[] = [];
|
pokes : Pokemon[] = [];
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user