Check out this plnkr:- https://embed.plnkr.co/prrHUd7r93XxIpZKdSNU/
- Download `checkbox-select.js` file in your project folder.-
Add it to your
index.html
using script tags. -
Add a reference to
checkbox-select
module while initiating the angular-app like belowangular.module("APP", ["checkbox-select"])
-
Now in the controller, define a list to iterate over using ng-repeat and a variable on scope to hold the selections, like below:-
angular .module("APP", ["checkbox-select"]) .controller("demoCtrl", ["$scope", function ($scope) { var dc = this // Defining list to iterate over dc.list = [ "selection1", "selection2", "selection3" ] // Defining variable to hold the selections dc.multipleSelections = [] }])
-
Now you can add the following attributes to the input element like below
<label ng-repeat="thing in dc.list"> <input type="checkbox" checkbox-model="dc.multipleSelections" checkbox-value="thing" multiple> {{thing}} </label>
-
Directive Attributes:-
Attribute Value Optional/not checkbox-model An Array variable on the scope to hold the selections. for eg. dc.multipleSelections Mandatory checkbox-value Iterator variable in ng-repeat Mandatory multiple No value. Using it, will allow multiple selections. Remove it, if you want to select one checkbox at a time Optional
If this repository helps you anyhow, please don't mind coming back and Buy Me Coffee OR you can use Gratipay to show your appreciation and gratitude.