How to do conditional rendering in angular-CodePudding

Hello everyone I'm trying to display different color based on variable value... My code looks like this :

 <nb-card accent = "a.zahtjevStatusNaziv == 'Kreiran' ? 'info' : 'success'" >
                  <nb-card-body>
                    <label >Kreator napomene:</label><br>
                    <p>{{a.imeKreatora}}</p>      
                    <label >Napomena:</label><br>
                    <p>{{!a.napomena ? "Prilikom ove akcije nije dodana napomena" : a.napomena}}</p>
                    <label >Datum kreiranja napomene:</label><br>
                    <p>{{a.datumKreiranja | date:'dd. MM. YYYY. HH:mm'}}</p>
                    <label >Poslovni proces:</label><br>
                    <p>{{a.poslovniProcesDokumenta.opis}}</p>
                    <label >Status dokumenta:</label><br>
                    <p>{{a.zahtjevStatusNaziv}}</p>
                  </nb-card-body>
              </nb-card>

I tried ngIf but when using ngIf I need to copy this whole block of code, so I would like only accent value (inside nb-card) to be changed:

<nb-card accent = "a.zahtjevStatusNaziv == 'Kreiran' ? 'info' : 'success'" >

Appreciate if someone can advise. Thank you in advance!

CodePudding user response：

It should look something like

<nb-card [accent] = "a.zahtjevStatusNaziv == 'Kreiran' ? 'info' : 'success'" >