Transitioning from server-side operations to AngularJS for real-time functionality is a new challenge I'm taking on.
With a user who can have multiple permissions, I'm facing an issue when it comes to repopulating checkboxes for permission changes. I'm currently utilizing the checklist-model directives which can be found here
My database setup includes tables for users, permissions, and users_permissions.
In my UsersController (Laravel)
public function show($id)
{
$user = User::with('permissions')->find($id);
return $user;
}
In my UserController (Angular)
Users.controller('UserController', ['$scope', '$routeParams', 'User', 'Permission', function($scope, $routeParams, User, Permission) {
$scope.user = User.get({ id: $routeParams.id });
$scope.permissions = Permission.query();
}]);
With permissions attached to the user on the server-side, viewing the object using console.log($scope.user)
returns the expected output.
View (single-user.html)
<h4>Manage Permissions</h4>
<div class="form-group">
<label ng-repeat="permission in permissions">
<input type="checkbox" checklist-model="user.permissions" checklist-value="permission.id" class="checkbox-inline">
{{ permission.display_name }}
</label>
</div>
<button class="btn btn-success" type="submit">Save</button>
My attempt to create an assigned variable in the controller containing $scope.user.permissions.id
to compare against $scope.permissions.id
did not provide the desired results. When I tried
$scope.assigned = $scope.user.permissions.id
and logged it, I only received 'undefined'.
If you have any pointers on creating an array of assigned permissions for comparison with standard permissions, I would greatly appreciate the advice.