Angular: Empty Fiddle
http://angularjs.org/
HTML
<div ng-controller="MyCtrl as test">
<div class="device" ng-repeat="item in test.items">
<!-- Enable/Disable-->
{{item.name}}
<a href="#" class="m-r-20" ng-click="test.toggleMethod(item)">
<span ng-if="item.enabled" class="fa fa-bell" title="Enable">Enabled</span>
<span ng-if="!item.enabled" class="fa fa-bell-slash" title="Disable">Disabled</span>
</a>
</div>
</div>
JavaScript
var myApp = angular.module('myApp', []);
myApp.controller('MyCtrl', function() {
var model = this;
model.items = [{
name: 'Device 123'
}, {
name: 'Device 434'
}, ];
model.items.map(function(item) {
item.enabled = false; // or other default value
});
model.toggleMethod = function(device) {
var deviceId = device.Id;
if (device.enabled) {
console.log('start');
//locationService.start(deviceId).then(deviceList);
} else {
console.log('stop');
//locationService.stop(deviceId).then(deviceList);
}
device.enabled = !device.enabled;
};
});