Tuesday, 21 March 2017

What angularjs expression syntax is this in ng-class

you've probably also seen something like this:







Very rad syntax.



EDIT:
What happens here, is that the "complete" class is added to the element if(item.Id != 0). Alternatively, we could write:

. 1 !== 0 which is "false" -- the "DoubleNegative" class is added to the element.







`



            | |      | |          | | |            |
| |result| |className | | | |
| | | | |
| function | | | condition |


Addendum




Also, I just realized that you can use a variety of different keys to map to your condition. For example:



ng-class="{ true: 'highlight', undefined: 'mute' }[ item.hasValue ]"



The mute class will be applied if item has no "hasValue" property. Furthermore, you can apply a class for any given type or value:



{'Jonathan Chapman': 'embolden', '[object Object]': 'hide'}[ item.toString() ]



In the following collection, this would embolden a person's name while hiding items that are objects:




[
'Jonathan Chapman',
{ aka: 'Johnny Applyseed' },
'Brad Pitt',
{ details: 'Fights Zombies' }
]


With this, you could watch for specific values in any $scope property. I suppose this could come in very handy at times.




Cheers

No comments:

Post a Comment

c++ - Does curly brackets matter for empty constructor?

Those brackets declare an empty, inline constructor. In that case, with them, the constructor does exist, it merely does nothing more than t...