API angulaire 10 I18nSelectPipe – GeeksforGeeks

Afficher la discussion

Améliorer l’article

Enregistrer l’article

J’aime l’article

Afficher la discussion

Améliorer l’article

Enregistrer l’article

J’aime l’article

Dans cet article, nous allons voir ce qui est I18nSelectPipe dans Angular 10 et comment l’utiliser.

I18nSelectPipe est un sélecteur utilisé pour afficher la chaîne qui correspond à la valeur actuelle.

Syntaxe:

{{ value | i18nSelect : map}}

NgModule : Le module utilisé par I18nSelectPipe est :

Approcher:

  • Créez l’application angulaire à utiliser.
  • Il n’y a pas besoin d’importer pour que le I18nSelectPipe soit utilisé.
  • Dans app.component.ts, définissez les variables qui prennent la valeur I18nSelectPipe.
  • Dans app.component.html, utilisez la syntaxe ci-dessus avec ‘|’ symbole pour créer un élément I18nSelectPipe.
  • Servez l’application angulaire en utilisant ng serve pour voir la sortie.

Valeur d’entrée :

  • évaluer: il prend une valeur de chaîne.

Paramètres:

  • mappage : il prend une valeur d’objet qui indique le texte qui doit être affiché pour différentes valeurs.

Exemple 1:

app.component.ts

import { Component, OnInit } 

from '@angular/core';

 

@Component({

    selector: 'app-root',

    templateUrl: './app.component.html'

})

export class AppComponent {

    

    age : string = 'twenty';

 

    

    votin : any =

    {'twenty': 'Can Vote', 'seventeen':'Cannot Vote'};}

app.component.html

<div>The User <b>{{age | i18nSelect: votin}}</b> </div>

Production:

8

Exemple 2 :

app.component.ts

import { Component, OnInit }

from '@angular/core';

 

@Component({

    selector: 'app-root',

    templateUrl: './app.component.html'

})

export class AppComponent {

    

    age : string = 'seventeen';

 

    

    votin : any = 

    {'twenty': 'Can Vote', 'seventeen':'Cannot Vote'};}

app.component.html

<div>The User <b>{{age | i18nSelect: votin}}</b> </div>

Production:

33

Référence: https://angular.io/api/common/I18nSelectPipe

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Aller en haut