web-dev-qa-db-fra.com

Attribut défini dynamiquement sur le composant dans le modèle html angular 2

J'essaie de définir un attribut sur un composant si une certaine expression est vraie. Quelqu'un pourrait-il me donner un exemple?

Ce que j'ai maintenant:

 <div [danger]="inArray(choice.likers, user, id)"></div>

mais cela ne compile pas.

inArray est ma propre méthode qui retourne vrai ou faux. Ce que j'aimerais voir, c'est que si l'expression retourne vrai, la sortie sera

<div danger></div>

Dans angular 1, il y avait cette instruction: ng-attr -... qui faisait exactement ce qui précède.

data-bindingangularangular2-template
19
Bram

Pour définir un attribut, utilisez liaison d'attribut:

 <div [attr.danger]="inArray(choice.likers, user, id)"></div>

Si vous souhaitez afficher un attribut vide, renvoyez conditionnellement une chaîne vide ou null dans inArray():

inArray() {
    let value;
    if (isInArray) {
      value = '';
    } else {
      value = null;
    }
    return value;
  }

donc l'attribut sera vide ou l'attribut danger n'existe pas. Le résultat est:

<div danger></div>
45
muetzerich