Question

我对Ember很新，在使用JS / jQuery之前我已经构建过几次这样的东西但是在2小时之后我似乎无法取得“Ember”方式的任何进展。

我从权限模型中获取了一组权限：

[
  {
    id : 1,
    permission : "Can Eat Cake",
    description : "User is allowed to eat cake."
  },
  {
    id : 2,
    permission : "Can Fly",
    description : "User is allowed to fly."
  },
  ...
]

我希望允许用户检查适用于特定角色的所有内容：

// RoleCreate.hbs
{{#each model.permissions}}
  {{input type="checkbox" name="rolePerm" checked=permChecked}} {{permission}}<br />
{{/each}}

到目前为止，所有内容都按预期运行/运行，但是，这是我被卡住的地方...如何获取已选中复选框的id /值数组，以便我可以创建如下所示的对象发送回服务器实际创建角色？

{
  roleName : "My new user role",
  permissions : [ 1, 2 ] 
}

我根本不知道如何将每个复选框的值传递给可以发送到服务器以创建新角色的父数组...我已经设法弄清楚如何让一个观察者开火检查/取消选中，但无论我尝试什么，似乎无法获得复选框的值。

// RoleCreateController
rolePermissionMgr : function() {

  console.log( "Permission Checkbox Changed!" );

}.observes( 'model.permissions.@each.permChecked' )

再一次，Ember很新，所以我确定我做错了一件或多件事。

Answer 1

你快到了。我将复选框值分配给模型。我只是在触发观察者时检查每个复选框值，并使用ember的数组方法提取权限。 Here is the working demo.

{{#each item in content.permissions}}
  <li>{{input type="checkbox" checked=item.value}} {{item.permission}}</li>
{{/each}}

App.IndexRoute = Ember.Route.extend({
  model: function() {
    return {
      roleName: 'Blessan',
      permissions: [{
        id : 1,
        permission : "Can Eat Cake",
        description : "User is allowed to eat cake."
      },{
        id : 2,
        permission : "Can Fly",
        description : "User is allowed to fly."
      }]
    };
  }
});

App.IndexController = Em.ObjectController.extend({
  permissionChanged: function() {
    var obj = {
      roleName: this.get('content.roleName'),
      permissions: this.get('content.permissions')
              .filterBy('value', true).mapBy('id');
    };
    console.info(obj);
  }.observes('content.permissions.@each.value')
});

根据一组复选框获取值数组

1 个答案: