convertir sélectionnez l'option à valeur booléenne
Je suis en train d'apprendre angular2. Ici, j'ai le Problème suivant:
J'ai un select
champ qui devrait fonctionner comme une valeur booléenne:
<select [(ngModel)]="caseSensitive">
<option>false</option>
<option>true</option>
</select>
Pas si je l'utilise dans mon Filtre, il va envoyer une chaîne de caractères, non pas comme un booléen. Est-il possible de le convertir avec un convertisseur ou quelque chose comme ça:
Voici mon code HTML complète:
<input [(ngModel)]="nameFilter"/>
<select [(ngModel)]="caseSensitive">
<option>false</option>
<option>true</option>
</select>
<table>
<tr *ngFor="let p of (persons | MyFilter: nameFilter:caseSensitive); let i = index">
<td>{{i + 1 }} </td>
<td>{{
p.givenName+" "+ p.familyName
}}</td>
<td><img src="/img/flags/{{ p.nationality}}.png"></td>
</tr>
</table>
Le ts code:
import { Component } from '@angular/core';
import {MyFilter} from './MyFilter';
@Component({
selector: 'pizza-root',
pipes: [MyFilter],
templateUrl: 'app.component.html'
})
export class AppComponent {
public year = new Date().getFullYear();
public persons =[{"givenName":"Paul", "familyName": "Smith", "nationality":"american"},
{"givenName":"Jens", "familyName":"myName1", "nationality":"german"},
{"givenName":"Ernst", "familyName":"myName1", "nationality":"german"},
{"givenName":"Jenny", "familyName":"myName1", "nationality":"german"}];
constructor (){
console.log(this.persons);
}
}
La Pipe:
import { Pipe, PipeTransform} from '@angular/core';
@Pipe({
name: 'MyFilter'
})
export class MyFilter implements PipeTransform{
transform( items: any[], args: string, caseSensitive : boolean ):any {
if (items != null && args != undefined && args != ''){
if (caseSensitive){
console.log("caseSensitive")
return items.filter(item=>item.givenName.indexOf(args)!== -1);
} else {
console.log("caseInSensitive")
return items.filter(item=> item.givenName.toLowerCase().indexOf(args.toLowerCase())!== -1);
}
}
console.log("else")
return items;
}
}
Le Problème, c'est que le tuyau ne fonctionne pas correctement parce que caseSensitive
est la liaison comme une chaîne de caractères, non pas comme une valeur booléenne.
- veuillez expliquer
Vous devez vous connecter pour publier un commentaire.
Par défaut, les valeurs sélectionnez utilise sont des chaînes de caractères ou ils sont stringified si d'autres types sont fournis. Si vous utilisez
ngValue
au lieu de cela, vous pouvez utiliser d'autres types etngModel
conserve le type.