Is there a way to add backlight to chips with an 'active' flag based on my key value type using
ng-class="{activeTag: $chip.active}"View
<md-chips class="custom-chips selected" ng-model="tags" ng-class="{activeTag: $chip.active}" readonly="true">
<md-chip-template style="cursor: pointer;" >
<a ui-sref="">
<strong>{{$chip.id}}</strong>
<em>({{$chip.name}})</em>
</a>
</md-chip-template>
</md-chips>
Controller
controller('ChipsController', function($scope) {
$scope.tags = [
{
id: 1,
name: 'Pop',
active: false
},
{
id: 2,
name: 'Rock',
active: true
},
{
id: 3,
name: 'Reggie',
active: false
}
];
});
css
.activeTag md-chip{
background: rgba(85, 107, 47, 0.66) !important;
color: white !important;
}