title: Ways to fade in and out of a dynamic ng-style background-image
body: <p>I have a main div with a dynamic ng-style background-image like so: </p>
  
  <pre><code>&lt;div class="modal slide-in-up profile-view" ng-style="{'background-image':'url(' + jobTypeSelected.backgroundImagePath + ')'}" ng-controller="tasksCtrl"&gt;
  ....
  &lt;/div&gt;
  </code></pre>
  
  <p>The backgroundImagePath is changing based on user select option. Everything works. But the image just shows up with the background-image setting. Is there a way to add animation on the ng-style background image transition? Like add a fadein and fadeout to smooth out the transition? I can not just set the opacity of the div as it contains all the content of this page (an Ionic popup). Any suggestion how I should approach this? </p>