Angular model formatter and parser pair that transforms a set of checkboxes to an array filled with arbitrary values.
<input type="checkbox" ng-model="ctrl.myModel" data-multi-select-value="::arrayValue">
/** | |
* @ngdoc directive | |
* @restrict E | |
* @name nl.meylingmedia.multiselect:multiSelectValue | |
* @module nl.meylingmedia.multiselect | |
* @description | |
* Angular model formatter and parser pair that transforms a set of checkboxes to | |
* an array filled with arbitrary values. | |
* | |
* @usage | |
* <input type="checkbox" ng-model="ctrl.myModel" data-multi-select-value="::arrayValue"> | |
*/ | |
angular.module('nl.meylingmedia.multiselect').directive('multiSelectValue', function() { | |
return { | |
restrict: 'A', | |
require: 'ngModel', | |
link: function(scope, element, attr, ngModel) { | |
ngModel.$formatters.push(function(value) { | |
var actualValue = scope.$eval(attr.multiSelectValue); | |
return angular.isArray(value) && value.indexOf(actualValue) !== -1; | |
}); | |
ngModel.$parsers.push(function(value) { | |
var actualValue = scope.$eval(attr.multiSelectValue); | |
if (!angular.isArray(ngModel.$modelValue)) { | |
ngModel.$modelValue = []; | |
} | |
var index = ngModel.$modelValue.indexOf(actualValue); | |
if (value === true && index === -1 ) { | |
ngModel.$modelValue.push(actualValue); | |
} | |
else if (value === false || index !== -1) { | |
ngModel.$modelValue.splice(index, 1); | |
} | |
return ngModel.$modelValue.slice(); | |
}); | |
} | |
} | |
}); |