Ember.js 그리고 난 다음 발견했습니다 ember.js 문서에서

Question

을 삭제하기위한 여러 모델을 선택 :

컨트롤러는 디스플레이 로직 모델을 장식 할 수 있습니다. 일반적으로 모델에는 서버에 저장된 속성이 있고 컨트롤러에는 서버에 저장할 필요가없는 속성이 있습니다.

"선택"기능을 응용 프로그램에 추가하려고합니다.

여기 jsfiddle이다 http://jsfiddle.net/JWf7X/

합니다 (CONSOLE.LOG 비어 있기 때문에) 그 필터 특성이없는 컨트롤러 모델별로 필터링되어 보인다.

this.filterProperty('isSelected', true); //managing models 

어떻게하면 removeSelected 작업을 올바르게 작성할 수 있습니까?

"isSelected"를 컨트롤러에 저장하는 올바른 방법은 무엇입니까? 이 속성은 REST API를 통해 서버에서로드되지 않으므로 모델에 isSelected를 추가하는 것이 올바른 방법이 아니므로 저장하지 않는 것이 좋습니다.

application.js :

window.App = Ember.Application.create(); 
App.ApplicationAdapter = DS.FixtureAdapter.extend(); 



App.Test = DS.Model.extend({ 
    title: DS.attr('string'), 
}); 


App.Test.FIXTURES = [ 
{ 
    id: 1, 
    title: 'Learn Ember.js', 
}, 
{ 
    id: 2, 
    title: '...', 
}, 
{ 
    id: 3, 
    title: 'Profit!', 
} 
]; 

App.IndexRoute = Ember.Route.extend({ 
    model: function() { 
    return this.get('store').find('test'); 
    } 
}); 

App.IndexController = Ember.ArrayController.extend({ 
    actions: { 
     removeSelected: function() { 
     var selected = this.filterProperty('isSelected', true); 
     console.log(selected); 
     } 
    }, 

}); 

App.TestController = Ember.ObjectController.extend({ 
    isSelected: false, 
}); 

index.html을 :

<script type="text/x-handlebars" data-template-name="index"> 
    <button {{action "removeSelected"}}>remove selected</button> 
    <ul> 
     {{#each itemController="test"}} 
     <li> 
      {{input type="checkbox" checked=isSelected}} 
      <label>{{title}}</label> 
     </li> 
     {{/each}} 
    </ul> 
</script> 

Answer 1

는, 소스를 찾고 각 뷰 도우미에서 itemController를 사용하여. IndexController 대신 새로운 어레이 컨트롤러를 만듭니다. 따라서 isSelected은 IndexController 안에 존재하지 않습니다.

당신은 설정하면이 작업을 얻을 것이다 itemControllerApp.IndexController로 :

인 IndexController :이

App.IndexController = Ember.ArrayController.extend({ 
    itemController: "test", 
    actions: { 
     removeSelected: function() { 
     var selected = this.filterProperty('isSelected', true); 
     console.log(selected); 
     } 
    } 
}); 

index.html을이 :

<script type="text/x-handlebars" data-template-name="index"> 
    <button {{action "removeSelected"}}>remove selected</button> 
    <ul> 
     {{#each}} 
     <li> 
      {{input type="checkbox" checked=isSelected}} 
      <label>{{title}}</label> 
     </li> 
     {{/each}} 
    </ul> 
</script> 

이것은 업데이트 바이올린입니다 이 작업으로 http://jsfiddle.net/marciojunior/BKUyk/