Angular2..why et comment?
Comment exécuter la condition ci-dessous si condition dans angular2
<td *ngFor="let val of rows;let j=index">
IF J==0
<label>{{val}}</label>
ELSE:
<label style="color:#000000;font-size:12px;padding-top: 5px">{{val}}</label>
</td>
Vous pouvez utiliser la directive * ngIf structural avec la syntaxe if-else pour obtenir ce résultat.
<label *ngIf="j === 0; else elseBlock">{{val}}</label>
<ng-template #elseBlock>
<label style="color:#000000;font-size:12px;padding-top: 5px">{{val}}</label>
</ng-template>
Une autre option consiste à utiliser deux blocs *ngIf
et à inverser le conditionnel, comme suit:
<label *ngIf="j === 0">{{val}}</label>
<label *ngIf="j !== 0" style="color:#000000;font-size:12px;padding-top:5px">{{val}}</label>
Si vous envisagez de passer à Angular 4, vous pouvez utiliser le nouveau modèle if/else dans ce modèle qui inclut cette version. Exemple:
<div *ngIf="someCondition; else falsyTemplate">
<h1>Condition Passed!</h1>
</div>
<ng-template #falsyTemplate>
<h1>Condition Failed!</h1>
</ng-template>
Vérifiez les liens utiles suivants:
Personnellement, je recommanderais de passer à Angular 4.
Vous pouvez le faire dans Angular 2 en utilisant l'élément <ng-container>
. Dans votre exemple, cela devrait ressembler à ceci:
<td *ngFor="let val of rows;let j=index">
<ng-container *ngIf="J==0">
<label>{{val}}</label>
</ng-container>
<ng-container *ngIf="J!=0">
<label style="color:#000000;font-size:12px;padding-top: 5px">{{val}}
</label>
</ng-container>
</td>
Vous pouvez trouver plus d'informations dans la documentation: https://angular.io/guide/structural-directives#ng-container-to-the-rescue .