<body ng-controller="myCtrl">
<input type="checkbox" ng-model="loaded"/>
<select ng-model="list">
<option ng-repeat="option in data.availableOptions" value="{{option.name}}">{{option.id}}</option>
</select>
{{list}}
<button ng-click="addtext()">Button</button>
<div id="container">
<img id="profile" ng-src="{{list}}" ng-show="loaded"/>
</div>
I have created this HTML code and I am looking to implement an animation that fades out the old image and fades in the new one when a different image is selected from the dropdown list. How can I achieve this effect using Angular?