체크 박스 세트를 기반으로 값 배열을 얻는다

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') 
});