CODEWITHSUNDEEP
javascriptangularjsangularjs-ng-repeat
Akash khan
Akash khan

Reputation: 979

Dynamic ng-model with checkbox in ng-repeat

I have a JSON object like as below with name $scope.permissions

{
    admission:{create:false,delete:false,read:false,update:false},
    student:{forDelete:false,read:false,viewPhone:false},
    course:{create:false,delete:false,read:false,update:false},
    teacher:{create:false,read:false,contact:false}
}

I want to make dynamic ng-model in each row like as

<div ng-repeat="(permissionName, permission) in permissions">
      {{permissionName}} |
      <label ng-repeat="(k,v) in permission">
         <input type="checkbox" ng-model="permission.k">
            {{ k }}
       </label>
      <button ng-click="updatePermission(permission)">Update</button>
</div>

When user will click on update button it will pass the student object with checkbox's value true or false.

Upvotes: 1

Views: 2925

Answers (1)

Pankaj Parkar
Pankaj Parkar

Reputation: 136184

You could first loop over permissions object with (key, value) format of ng-repeat

Markup

<div ng-repeat="(permissionName, permission) in permissions">
    {{permissionName}} |
    <label ng-repeat="(k,v) in permission">
      <input type="checkbox" ng-model="permission[k]"> {{ k }}
    </label>
    <button ng-click="updatePermission(permission)">Update</button>
</div>

Demo Plunkr

Upvotes: 1

Related Questions