最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Cleaner way to add both static and variable class in html in Angular 2 - Stack Overflow

programmeradmin0浏览0评论

It could be silly but how do I do something like this in angular 2 in a cleaner way? (Avoiding the string concatenation)

<div [class]="'indicator indicator-circle ' + colorClass"></div>

Explanation : I want to add two static classes indicator & indicator-circle at all times but I also want the colorClass to be applied which is an input from the ponent class.

It could be silly but how do I do something like this in angular 2 in a cleaner way? (Avoiding the string concatenation)

<div [class]="'indicator indicator-circle ' + colorClass"></div>

Explanation : I want to add two static classes indicator & indicator-circle at all times but I also want the colorClass to be applied which is an input from the ponent class.

Share Improve this question edited May 18, 2016 at 7:22 Pankaj Parkar 136k23 gold badges240 silver badges303 bronze badges asked May 16, 2016 at 9:47 Praveen PugliaPraveen Puglia 5,6415 gold badges38 silver badges70 bronze badges
Add a ment  | 

3 Answers 3

Reset to default 6

You could leverage the ngClass directive with an array:

<div [ngClass]="['indicator', 'indicator-circle', colorClass]"></div>

See this link for more details:

  • https://angular.io/docs/ts/latest/api/mon/index/NgClass-directive.html

You can use ngClass

<div class="indicator indicator-circle" [ngClass]="colorClass"></div>

You need to put only colorClass in [ngClass]/[attr.class]/[class] property binding

<div class="indicator indicator-circle" [ngClass]="colorClass"></div>
发布评论

评论列表(0)

  1. 暂无评论