title: How to apply multiple styles based on multiple conditions in ng-style directive?
body: <p>In angular, I need to apply different style attributes based on different conditions but its not working this way and I only can apply 2 conditions with conditional expression. </p>
  
  <pre><code>&lt;div ng-style="
      (status=="up")  ?{'background-color':'green' ,'color':'green'}
      (status=="down")?{'background-color':'red'   ,'color':'red'}
      (status=="idle")?{'background-color':'yellow','color':'yellow'}
      (status=="")    ?{'background-color':'grey'  ,'color':'grey'}
  "&gt;
  </code></pre>
  
  <p>It would be better if you know any way to pass attribute to a function that returns style obj for ng-style like bellow which is weirdly not working! </p>
  
  <pre><code>$scope.styleFn(status,attr) {
          (status=="up")  ?{attr:'green'}
          (status=="down")?{attr:'red'}
          (status=="idle")?{attr:'yellow'}
          (status=="")    ?{attr:'grey'}
  }
  
  &lt;div ng-style="styleFn('up','background-color')"&gt;
  </code></pre>