Search code examples
angulartypescriptmustache

Angular - Can I make a SWITCH or a IF based on a JSON value?


I have a json file with values of the car and according to the "edition" of the car, I want to display the correct price, the value of "price" if it's standard, the value of "deluxe" if it's a deluxe edition:

    <div *ngIf="{{products[0].edition}}" = "standard">
    <td>
        <input type="number" [(ngModel)]="price0" (ngModelChange)="calcul0()" placeholder="Price"/>
        {{products[0].price | currency:'EUR'}}
    </td>
</div>
<div *ngIf="{{products[0].edition}}" = "deluxe">
    <td>
    <input type="number" [(ngModel)]="price0" (ngModelChange)="calcul0()" placeholder="Price"/>
    {{products[0].deluxe | currency:'EUR'}}
    </td>

In my json file, I get:

    [
      {
        "car": "Mercedes",
        "edition": "standard",
        "price": 90,
        "deluxe": 100,
        "deluxeTurbo": 120,
      },
...
    ]

If I don't put a if condition and go directly:

{{products[0].deluxe | currency:'EUR'}}

I got "100"


Solution

  • Don't use braces in *ngIf, put the condition directly in valid TypeScript:

    <div *ngIf="products[0].edition == 'deluxe'">