if-has-permission

AngularJS directive to enable/disable dom elements based on the user permissions.

Install & Run

$ cd /tmp
$ git clone https://github.com/dezoxel/if-has-permission.git
$ cd if-has-permission
$ npm install
$ bower install
$ gulp serve

After running latest command your default browser will be automatically opened with Demo application. If browser was not opened, please open the http://localhost:3000 on your favorite browser.

Setup

// run.js
.run(function(userPermissions) {
  // get the permissions list of current user here (ex. from server)
  var list = ['add', 'edit'];
  userPermissions.set(list);
});

Examples

Enable element if user has specified permission:

<div if-has-permission="'add'">Add link here</div>
<div if-has-permission="'delete'">Delete link here</div>

Enable element if user has ANY of the specified permissions:

<div if-has-permission="['add', 'edit']">Member section</div>
<div if-has-permission="['admin', 'moderator']">Manager section</div>

Enable element if user has specified permissions using boolean expression:

<div if-has-permission="'add' & 'edit' | 'admin'">Writer section</div>
<div if-has-permission="'view' | 'read' | 'publish' | 'admin'">Secret</div>

It is also possible write expr w/o single qoutes:

<div if-has-permission="add & edit | admin">Secret</div>
<div if-has-permission="view | read | publish | admin">Secret</div>

Logical (not bitwise) operators also supported:

<div if-has-permission="add && edit || admin">Secret</div>
<div if-has-permission="view || read || publish || admin">Secret</div>