Add multiple values to disabled attribute in Angular

Question

I am trying to add values to a disabled directive. So if you look at the code below I am disabling a button if a value matches System Admin. I am now trying to add more values to this. So I want to add System Admin and HR Manager to this.

[disabled]="userRole === 'System Admin'"

I tried this but it does not seem to work

[disabled]="userRole === 'System Admin' || 'HR Manager'"

Answer 1

If you have many conditions to check then its better to write a function which will return true or false:

HTML:

[disabled]="isDisabled(userRole)"

Typescript:

isDisabled(userRole:string):boolean {
  if(userRole == "System Admin" || userRole == "HR Manager") {
    return true
  }
  return false
}