Ember: How to add "else" to wrap component?

Question

I have a component to hide some parts of design depending on user permissions.

Just hide is not a problem. Sometimes I need to display something when user has no access.

route template:

{{#restricted-access required-action="AddRoles"}}
    <button class="btn btn-success"  {{action 'add'}}>
        Add New Role
    </button>
{{else}}
    You can not add Roles
{{/restricted-access}}

component check code:

actionAllowed: function() {
    var permission = this.get('current.user.role.roleActionList');
    return permissions.filterProperty('code', this.get('required-action')).length > 0;
}.property('current.user.role.roleActionList.length')

component template:

{{#if actionAllowed}}
    {{yield}}
{{/if}}

I'm looking for something like

{{#if actionAllowed}}
    {{yield}}
{{else}}
    {{else yield}}
{{/if}}

Where I can add text that is defined in route template.

I guess I can do something like that:

{{#restricted-access required-action="AddRoles"}}
    {{#access-granted}}
        <button class="btn btn-success"  {{action 'add'}}>
            Add New Role
        </button>
    {{#access-granted}}
    {{#access-declined}}
        You can not add Roles
    {{/access-declined}}
{{/restricted-access}}

Actually I do not like this As I had to create additional components.

Is there any way to implement required functionality in one component?

Answer 1

由于你的else块只是一个字符串，我只是传递一个带有else文本的参数：

do

模板组件：

for /f %%a

Answer 2

组件应与控制器/模型无关，它更像是显示/操作功能。

我建议您使用控制器方法和if来检查权限：

{{#if restriction.canAddroles}}
 ..actions...
{{else}}
  You can not add Roles
{{/if}}

可以使用初始化程序将

restriction注入所需的控制器。

#... restriction class
export Ember.Object.create 
  canAddroles: ->
   @actionAllowed('addRoles')

  actionAllowed: ->
    # code from your post

我知道由于if限制，它更加冗长，但现在你的逻辑存储在适当的位置，而且它更容易测试。