Conditionally apply the evaluated class name of an expression?

I originally had this, and it was easy: ng-class="response.name" (Where response.namewas the evaluated expression.)

But now I'm trying to do this: ng-class="{response.name: true, tooltip: someExpression}"(so it is response.namealways present, but it tooltipdepends on the context.)

You see, I cannot have response.nameas a key in an object ... I know that. He just takes it as a string response.nameliterally and there is no rating. But I need a class tooltipthat will be applied conditionally. I do not know how to combine these needs!

At first, I tried just using a few attributes of the ng class, but it just ignored everything except the first one.

+4
source share
4 answers

<div ng-class="{tooltip: someExpression}" class="{{response.name}}"></div>

, , , .

+1

FWIW: Angular 1.4 :

ng-class="[response.name, {tooltip: someExpression}]"
+1

ng-class allows you to:

<div ng-class="[response.name, {tooltip: someExpression}"></div>
+1
source

I personally decided this with this disgusting:

{ {{ response.name }}: true, 'tooltip-container': {{ !!response.tooltip }} }

Evaluated expressions interpolated into the evaluated expression. Ugly. Definitely a good Rob.

0
source

Source: https://habr.com/ru/post/1583836/


All Articles