How to use ngClass in Angular-CodePudding

I have the below piece of code in angular to show icons with for ngClass and class:

<i
            
            [ngClass]="{
              warning: alarmType === ('ucmgmt.onPremError.emergency' | translate),
              warning: alarmType === ('ucmgmt.onPremError.critical' | translate),
              warning: alarmType === ('common.alert' | translate),
              warning: alarmType === ('ucmgmt.onPremError.error' | translate),
              danger: alarmType === ('ucmgmt.onPremError.warning' | translate),
              info: alarmType === ('ucmgmt.onPremError.info' | translate)
            }"
          ></i
          >

What I have to show is if the icon has text Emergency or Critical or Alert or Error, it has to use the class warning. Currently my ngClass is not working as expected. Please help. Thanks in advance.

CodePudding user response：

The problem comes from the class name. It should be in single quotes. I also changed the code a bit.

<i 
  [ngClass]="{
    'warning': (alarmType === ('ucmgmt.onPremError.emergency' | translate) 
    || alarmType === ('ucmgmt.onPremError.critical' | translate) 
    || alarmType === ('common.alert' | translate)
    || alarmType === ('ucmgmt.onPremError.error' | translate)),
    'danger': alarmType === ('ucmgmt.onPremError.warning' | translate),
    'info': alarmType === ('ucmgmt.onPremError.info' | translate)
  }"></i>