How to use expression with md-colors directive?

Question

I am using AngularJS material, and I would like to apply values md-colors=""based on an expression in the same way that an expression can be used with ng-class="". I could not get this to work.

Here is an example:

<md-button md-colors="{background:'accent-900-0.43' : mode == 'development'}" ng-click="setMode('development')">
development
</md-button>

The desired result is that the md-button will accept the background color accent-900, if the condition is mode=='development'true.

Is it possible to use md colors this way?

Answer 1

you can use the triple operation inside md-colorto style

<md-button md-colors="mode == 'development' ? {background:'accent-900-0.43'} : {background:'whatever_condition_false_color'} " ng-click="setMode('development')">
development
</md-button>