Wie blende ich den Etikettentext aus, wenn der Wert leer ist?

Question

Innerhalb einer Tabellenzelle listet ich mehrere Elemente auf, die mit ng-repeat aufgefüllt werden. Dabei wird die folgende Struktur verwendet. Bei einigen Einträgen sind Eigenschaften wie "user.favcolor" jedoch leer. Was ist der einfachste Weg, um Text wie "Lieblingsfarbe:" in diesem Fall zu verstecken, so dass ich nicht mit einer Zeile, die "Lieblingsfarbe:" und keinen Wert daneben hat?

 <table> 
      <thead> 
       <tr> 
        <th>Price</th> 
        <th>Plan Contents</th> 
       </tr> 
      </thead> 
      <tbody> 
       <tr ng-repeat="tip in tips"> 
        <td>{{tip.priceMonthly}}</td> 
        <td><span>Name: {{user.name}}</span> 
         <span>ID: {{user.id}}</span> 
         <span>Favorite color: {{user.favcolor}}</span> 
        </td> 
       </tr> 
      </tbody> 
     </table> 

Answer 1

können Sie die für diese ng-show Direktive verwenden:

<span ng-show="user.favcolor">Favorite color: {{user.favcolor}}</span> 

Die ng-show Werke, so dass das Element nur dann, wenn der Ausdruck true wertet gezeigt. Eine leere Zeichenfolge wird hier false ausgewertet, um das gesamte Element auszublenden.

Alternativ können Sie auch einen Standardwert angeben:

<span>Favorite color: {{user.favcolor || "Not specified" }}</span> 

In diesem Fall, wenn user.favcolor zu einem false auswertet, es Not specified stattdessen gedruckt werden.