Ngclass angular

Ngstyle

<div [ngStyle]="{'background-color':person.country === 'UK' ? 'green' : 'red' }"></<div>

Angular ngclass

      
        content_copy
      
      <some-element [ngClass]="'first second'">...</some-element>

<some-element [ngClass]="['first', 'second']">...</some-element>

<some-element [ngClass]="{'first': true, 'second': true, 'third': false}">...</some-element>

<some-element [ngClass]="stringExp|arrayExp|objExp">...</some-element>

<some-element [ngClass]="{'class1 class2 class3' : true}">...</some-element>

Source: angular.io

NgClass

//Type one
[class.my_class] = "step === 'step1'"

//Type two
[ngClass]="{'my_class': step === 'step1'}"
and multiple option:
[ngClass]="{'my_class': step === 'step1', 'my_class2' : step === 'step2' }"

//Type three
[ngClass]="{1 : 'my_class1', 2 : 'my_class2', 3 : 'my_class4'}[step]"

//Type four
[ngClass]="step == 'step1' ? 'my_class1' : 'my_class2'"

Source: stackoverflow.com

Angular 8 ngClass If

[ngClass]="(step=='step1')?'my-class1':'my-class2'"

Source: stackoverflow.com

Ngclass

 [ngClass]="eventCondition ? '':'disabled_btn'"

Ngclass angular

<div [ngClass]="{ 
'green': number > 5,
  'red': number <= 5,
}" ></div>
//if the number is over 5, the class 'green' will be added to the div.
//if the number is below or equal 5, the class 'red' will be added to the div.

Similar codes

0 vote134 views1 answer
Apexcharts pie chart colors
TypeScript
0 vote74 views1 answer
Find unique values between 2 lists R
TypeScript
0 vote83 views1 answer
DISTINQUISH BETWEEN THE AVERAGE CASE AND WORSE CASE RUNNING TIME AND THE FACTORS AFFECTING THAT AFFECTS THE RUNNING TIME OF AN ALGORITHM
TypeScript
11 votes91 views2 answers
Tonumber typescript / Number typescript
TypeScript
0 vote86 views1 answer
Combine 2 lists to dataframe python
TypeScript
0 vote87 views1 answer
Conditional styled components with media query
TypeScript
0 vote81 views3 answers
Typescript with babel
TypeScript
0 vote72 views1 answer
Download objects under a prefix in golang
TypeScript
0 vote44 views2 answers
How to get both key and value of enum in typescript
TypeScript
1 vote89 views1 answer
Ts object field from variable
TypeScript