Angular multiple ngif Else passing parameter in template

Asked

Viewed 917 times

0

Is it possible to make two ngIf in the angular.html? follows an example

if(1=2){
}else{
    if(){
    }
}

need to do two checks.

Check teacher constraint if false check classroom availability.

if an example of my code. I am new at angular and do not know how everything works.

<td *ngIf="!restricaoSegUm; else templateName"
    *ngIf="!restricaoSalaSegUm; else sala"
    [dragula]='"another-bag"'
    [dragulaModel]='segUm'>
    <div [@resultadoAnimacao]="animationsState"
        class="cursor-pointer"
        *ngFor='let s1 of segUm'
        (dblclick)="removeNumbers(s1,this.segUm)">
        {{s1?.no_diciplinas}}
    </div>
</td>

<ng-template #templateName>
    <td style="background-color: rgb(244, 67, 54);"></td>
</ng-template>
<ng-template-sala #sala>
    <td style="background-color: rgb(244, 146, 54);"></td>
</ng-template-sala>

Some help on how to solve?

1 answer

0

Sometimes writing in pseudocode helps to clarify the goal:

se restricaoSegUm == False && restricaoSalaSegUm == False então
    mostrar <div class="cursor-pointer">
senao
    se restricaoSegUm == True então
        mostrar <ng-template #templateName>
    senao se restricaoSalaSegUm == True então
        mostrar <ng-template-sala #sala>

Making use of the directive NgIf (Angular 4 and 5)

<td *ngIf="!restricaoSegUm && !restricaoSalaSegUm"
    [dragula]='"another-bag"'
    [dragulaModel]='segUm'>
    <div [@resultadoAnimacao]="animationsState"
        class="cursor-pointer"
        *ngFor='let s1 of segUm'
        (dblclick)="removeNumbers(s1,this.segUm)">
        {{s1?.no_diciplinas}}
    </div>
</td>

<ng-template *ngIf="restricaoSegUm; else sala" #templateName>
    <td style="background-color: rgb(244, 67, 54);"></td>
</ng-template>

<ng-template-sala *ngIf="restricaoSalaSegUm" #sala>
    <td style="background-color: rgb(244, 146, 54);"></td>
</ng-template-sala>
  • Friend, can ng-template receive a variable? only thing I need to do is: if the restriction is ng-tamplate teacher gets background-color red if it is ng-template room turns orange

  • @Herick would not be the case so use ng-class in the div cursor-pointer? I believe you want to stylize the div who get information instead of a ng-template emptiness.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.