11# Ember-can
22
3- <p align =" center " >
4- <a href =" http://badge.fury.io/js/ember-can " title =" Package version " >
5- <img src="https://badge.fury.io/js/ember-can.svg"/>
6- </a >
3+ <a href =" http://badge.fury.io/js/ember-can " title =" Package version " >
4+ <img src =" https://badge.fury.io/js/ember-can.svg " />
5+ </a >
76
8- <a href =" https://emberobserver.com/addons/ember-can " title =" Ember Observer " >
9- <img src="http://emberobserver.com/badges/ember-can.svg" alt="Ember Observer"/>
10- </a >
7+ <a href =" https://emberobserver.com/addons/ember-can " title =" Ember Observer " >
8+ <img src =" http://emberobserver.com/badges/ember-can.svg " alt =" Ember Observer " />
9+ </a >
1110
12- <a href =" https://travis-ci.org/minutebase/ember-can " title =" Travis CI status " >
13- <img src="https://travis-ci.org/minutebase/ember-can.svg?branch=master" alt="Travis CI Status"/>
14- </a >
11+ [ ![ CI] ( https://github.com/minutebase/ember-can/actions/workflows/ci.yml/badge.svg )] ( https://github.com/minutebase/ember-can/actions/workflows/ci.yml )
1512
16- <a href =" https://david-dm.org/minutebase/ember-can " title =" dependencies status " >
17- <img src="https://david-dm.org/minutebase/ember-can/status.svg"/>
18- </a >
19- </p >
20-
21- ___
13+ ---
2214
2315Simple authorisation addon for Ember.
2416
@@ -45,6 +37,7 @@ Resolver = extendResolver(Resolver);
4537Without this update, the app will encounter an error where it cannot find your abilities.
4638
4739After these changes your app file should look something like:
40+
4841``` js
4942import Application from ' @ember/application' ;
5043import Resolver from ' ember-resolver' ;
@@ -61,18 +54,17 @@ export default class App extends Application {
6154loadInitializers (App, config .modulePrefix );
6255```
6356
64-
6557## Compatibility
6658
67- * Ember.js v4.12 or above
68- * Embroider or ember-auto-import v2
59+ - Ember.js v4.12 or above
60+ - Embroider or ember-auto-import v2
6961
7062## Quick Example
7163
7264You want to conditionally allow creating a new blog post:
7365
7466``` hbs
75- {{#if (can " create post" )}}
67+ {{#if (can ' create post' )}}
7668 Type post content here...
7769{{else}}
7870 You can't write a new post!
@@ -152,8 +144,9 @@ export default class CreatePostComponent extends Component {
152144The ` can ` helper is meant to be used with ` {{if}} ` and ` {{unless}} ` to protect a block (but can be used anywhere in the template).
153145
154146``` hbs
155- {{can " doSth in myModel" model extraProperties}}
147+ {{can ' doSth in myModel' model extraProperties}}
156148```
149+
157150- ` "doSth in myModel" ` - The first parameter is a string which is used to find the ability class call the appropriate property (see [ Looking up abilities] ( #looking-up-abilities ) ).
158151
159152- ` model ` - The second parameter is an optional model object which will be given to the ability to check permissions.
@@ -164,8 +157,9 @@ The `can` helper is meant to be used with `{{if}}` and `{{unless}}` to protect a
164157automatically update accordingly.**
165158
166159#### Example
160+
167161``` hbs
168- {{#if (can " edit post" post)}}
162+ {{#if (can ' edit post' post)}}
169163 ...
170164{{else}}
171165 ...
@@ -176,7 +170,7 @@ As it's a sub-expression, you can use it anywhere a helper can be used.
176170For example to give a div a class based on an ability you can use an inline if:
177171
178172``` hbs
179- <div class={{if (can " edit post" post) " is-editable" }}>
173+ <div class={{if (can ' edit post' post) ' is-editable' }}>
180174
181175</div>
182176```
@@ -186,10 +180,9 @@ For example to give a div a class based on an ability you can use an inline if:
186180Cannot helper is a negation of ` can ` helper with the same API.
187181
188182``` hbs
189- {{cannot " doSth in myModel" model extraProperties}}
183+ {{cannot ' doSth in myModel' model extraProperties}}
190184```
191185
192-
193186## Abilities
194187
195188An ability class protects an individual model which is available in the ability as ` model ` .
@@ -229,7 +222,7 @@ You can do this in the helpers, for example this will set the `model` to `projec
229222but also ` member ` as a bound property.
230223
231224``` hbs
232- {{#if (can " remove member from project" project member=member)}}
225+ {{#if (can ' remove member from project' project member=member)}}
233226 ...
234227{{/if}}
235228```
@@ -255,20 +248,20 @@ Then for the ability name we remove some basic stopwords (of, for in) at the end
255248
256249For example:
257250
258- | String | property | resource | pod |
259- | ----------------------------- | -------------------- | ------------------------- | -------------------------------- |
260- | write post | ` canWrite ` | ` /abilities/post.js ` | ` app/pods/post/ability.js ` |
261- | manage members in project | ` canManageMembers ` | ` /abilities/project.js ` | ` app/pods/project/ability.js ` |
262- | view profile for user | ` canViewProfile ` | ` /abilities/user.js ` | ` app/pods/user/ability.js ` |
251+ | String | property | resource | pod |
252+ | ------------------------- | ------------------ | ----------------------- | ----------------------------- |
253+ | write post | ` canWrite ` | ` /abilities/post.js ` | ` app/pods/post/ability.js ` |
254+ | manage members in project | ` canManageMembers ` | ` /abilities/project.js ` | ` app/pods/project/ability.js ` |
255+ | view profile for user | ` canViewProfile ` | ` /abilities/user.js ` | ` app/pods/user/ability.js ` |
263256
264257Current stopwords which are ignored are:
265258
266- * for
267- * from
268- * in
269- * of
270- * to
271- * on
259+ - for
260+ - from
261+ - in
262+ - of
263+ - to
264+ - on
272265
273266## Custom Ability Lookup
274267
@@ -289,7 +282,7 @@ export default class AbilitiesService extends Service {
289282 let [abilityName, propertyName] = str .split (' .' );
290283 return { propertyName, abilityName };
291284 }
292- };
285+ }
293286```
294287
295288You can also modify the property prefix by overriding ` parseProperty ` in our ability file:
@@ -326,7 +319,7 @@ The ability classes will now have access to `session` which can then be used to
326319
327320## Components & computed properties
328321
329- In a component, you may want to expose abilities as computed properties
322+ In a component, you may want to expose abilities as computed properties
330323so that you can bind to them in your templates.
331324
332325``` js
@@ -351,7 +344,7 @@ export default class MyComponent extends Component {
351344
352345## Accessing abilities within an Ember engine
353346
354- If you're using [ engines] ( http://ember-engines.com/ ) and you want to access an * ability * within it, you will need it to be present in your Engine’s namespace. This is accomplished by doing what is called a "re-export":
347+ If you're using [ engines] ( http://ember-engines.com/ ) and you want to access an _ ability _ within it, you will need it to be present in your Engine’s namespace. This is accomplished by doing what is called a "re-export":
355348
356349``` javascript
357350// my-engine/addon/abilities/foo-bar.js
@@ -383,26 +376,26 @@ stub the service following [the official EmberJS guide](https://guides.emberjs.c
383376
384377### Installation
385378
386- * ` git clone https://github.com/minutebase/ember-can.git `
387- * ` cd ember-can `
388- * ` npm install `
379+ - ` git clone https://github.com/minutebase/ember-can.git `
380+ - ` cd ember-can `
381+ - ` npm install `
389382
390383### Linting
391384
392- * ` npm run lint:hbs `
393- * ` npm run lint:js `
394- * ` npm run lint:js -- --fix `
385+ - ` npm run lint:hbs `
386+ - ` npm run lint:js `
387+ - ` npm run lint:js -- --fix `
395388
396389### Running tests
397390
398- * ` ember test ` – Runs the test suite on the current Ember version
399- * ` ember test --server ` – Runs the test suite in "watch mode"
400- * ` ember try:each ` – Runs the test suite against multiple Ember versions
391+ - ` ember test ` – Runs the test suite on the current Ember version
392+ - ` ember test --server ` – Runs the test suite in "watch mode"
393+ - ` ember try:each ` – Runs the test suite against multiple Ember versions
401394
402395### Running the dummy application
403396
404- * ` ember serve `
405- * Visit the dummy application at [ http://localhost:4200 ] ( http://localhost:4200 ) .
397+ - ` ember serve `
398+ - Visit the dummy application at [ http://localhost:4200 ] ( http://localhost:4200 ) .
406399
407400For more information on using ember-cli, visit [ https://ember-cli.com/ ] ( https://ember-cli.com/ ) .
408401
0 commit comments