Is it possible to add an icon to an option in a dropdown based on if it matches a certain setting from the data returned in an ng-repeat?
I have the following select and the options within that select are created via an ng-repeat that is going off of the data records pulled back from the database.
<select id="playListOpt" class="form-control"
ng-model="playlistItem.selectedObjectId"
ng-change="resetModal()" ng-required="true">
<option role="option" value="0" selected>
@Resources.L_LMS_ActDetails.CreateNewPlaylist
</option>
<option role="option" ng-repeat="playlistItem in playlistDataForActivity"
value="{{playlistItem.Id}}">
{{playlistItem.Name}}
</option>
</select>
As it loops over the playlistDataForActivity is it possible to find the item that has IsDefault = 1 and add an icon next to that option?
This works by changing the color of the option that is set to 'Default' by using the ng-style attribute. What's the best way to add a FontAwesome icon?
<select id="playListOpt" class="form-control"
ng-model="playlistItem.selectedObjectId" ng-change="resetModal()"
ng-required="true">
<option role="option" value="0">
@Resources.L_LMS_ActDetails.CreateNewPlaylist
</option>
<option role="option" ng-repeat="playlistItem in playlistDataForActivity"
ng-style="playlistItem.IsDefault && {'color' : 'red'}"
value="{{playlistItem.Id}}">
{{playlistItem.Name}}
</option>
</select>