javascript - Binding dynamic checkbox in angular.js -
i have list of options pulled database via json based on product selection in angular.js
here's sample code:
<ion-checkbox ng-repeat="extra in extras" ng-model="order.extras" checklist-value="{{ extra.id }}"><strong>{{ extra.name }}</strong></ion-checkbox>
i want user able select multiple extras can't seem able bind these selections.
i think work ng-model="order.extras[extra.id]"
can track checked extras in order.extras
.
please have @ demo below or @ jsfiddle.
angular.module('demoapp', ['ionic']) .controller('maincontroller', maincontroller); function maincontroller($scope) { $scope.order = {}; $scope.extras = [ { id: 0, name: 'first' }, { id: 1, name: 'second' }, { id: 2, name: 'third' } ] }
<link href="https://cdnjs.cloudflare.com/ajax/libs/ionic/1.2.4/css/ionic.min.css" rel="stylesheet"/> <script src="https://cdnjs.cloudflare.com/ajax/libs/ionic/1.2.4/js/ionic-angular.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/ionic/1.2.4/js/ionic.bundle.js"></script> <div ng-app="demoapp" ng-controller="maincontroller"> <ion-content> <ion-checkbox ng-repeat="extra in extras" ng-model="order.extras[extra.id]" checklist-value="{{ extra.id }}"><strong>{{ extra.name }}</strong></ion-checkbox> current order: {{order}} </ion-content> </div>
Comments
Post a Comment