Warunkowe (jeśli, inaczej) w Angular 2

Question

Witam Pracowałem kilka lat w .NET, silveright teraz zaczynam od agular 2 i expressjs. I mam wątpliwości, że nawet ja nie mogłem znaleźć, jak mogę to zrobić w kanciastych 2 + expressjs i jest bezpieczny od strony klienta?

<% if(User.Identity.IsAuthenticated){ %> 
    <b>Sign Out</b> 
<% } else { %> 
    <b>Sign In</b> 
<% } %> 

Answer 1

Jeśli potrzebujesz "else", być może najlepszym sposobem jest użycie NgSwitch (https://angular.io/docs/ts/latest/api/common/index/NgSwitch-directive.html)

Więc coś takiego:

<div [ngSwitch]="User?.Identity?.IsAuthenticated"> 
    <b *ngSwitchCase="true">Sign Out</b> 
    <b *ngSwitchDefault>Sign In</b> 
</div> 

Answer 2

kątowo 4, teraz jest to możliwe:

• synchronicznie

  Załóżmy, że mamy zdefiniowane tej klasy zmiennej:

  shown: boolean = true; 
  

  Jeśli jeszcze składnia:

  <button (click)="shown = !shown">toggle 'shown' variable</button> 
  <div *ngIf="shown; else elseBlock">If shown</div> 
  <ng-template #elseBlock>else not shown</ng-template> 
  

  Zauważ, że ng-template muszą być stosowane w celu tej dyrektywy strukturalnej do pracy, więc jeśli masz komponent niestandardowy, zawiń go wewnątrz ng-template. Poniżej znajduje się alternatywna składnia, która również wiąże się z tą samą zmienną klasy.

  Jeśli więc jeszcze składni:

  <button (click)="shown = !shown">toggle 'shown' variable</button> 
  <div *ngIf="shown; then primaryBlock; else secondaryBlock"></div> 
  <ng-template #primaryBlock>If shown</ng-template> 
  <ng-template #secondaryBlock>else not shown</ng-template> 
  

  ---

• asynchronicznie

  klasy:

  userObservable = new Subject<{first: string, last: string}>(); 
  onButtonClick() { 
      this.userObservable.next({first: 'John', last: 'Smith'}); 
  } 
  

  Szablon:

  <button (click)="onButtonClick()">Display User</button> 
  <div *ngIf="userObservable | async as user; else loading"> 
      Hello {{user.last}}, {{user.first}}! 
  </div> 
  <ng-template #loading>Waiting for click...</ng-template>