CODEWITHSUNDEEP
angularangular-directiveangular-template
James Newton
James Newton

Reputation: 7092

Getting ng-class to work

When I test ng-class in the w3schools.com Try It page, everything works as the documentation says. When I try it in a bare-bones Angular 2 app, I get no joy.

Here are my steps. In a Terminal window:

  1. ng new classTest
  2. cd classTest
  3. ng serve

In a text editor:
app.component.css

.red {
  color: #f00;
}

app.component.html

<h1 ng-class="{'red': true}">
  {{title}}
</h1>

Result: the text app works! appears in black, not red. I have tried a number of other variations, such as ng-class="'red'", in the w3schools.com Try It page, the text goes as red as you please.

What am I missing?

Upvotes: 1

Views: 826

Answers (1)

Stefan Svrkota
Stefan Svrkota

Reputation: 50633

That's AngularJS example, syntax for NgClass directive in Angular 2 is the following:

<h1 [ngClass]="{'red': true}">
    {{title}}
</h1>

You can read more about NgClass directive here.

Upvotes: 2

Related Questions