簡體   English   中英

Ember.js並選擇多個模型進行刪除

[英]Ember.js and selecting multiple models for deleting

在ember.js文檔中,我找到了下一個:

控制器允許您使用顯示邏輯裝飾模型。 通常,您的模型將具有保存到服務器的屬性,而控制器將具有您的應用程序不需要保存到服務器的屬性。

我正在嘗試向我的應用程序添加“選擇”功能。

這是jsfiddle: http : //jsfiddle.net/JWf7X/

似乎filter屬性是按模型而不是控制器進行過濾的(因為console.log為空)。

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

如何正確編寫removeSelected操作?

是在控制器中存儲“ isSelected”的正確方法嗎? 我認為為模型添加isSelected是不正確的方法,因為此屬性不會通過REST API從服務器加載,也不會保存到該屬性。

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>

在每個視圖幫助器中使用itemController查找源。 將創建一個新的數組控制器,而不使用您的IndexController 因此isSelected將不會出現在IndexController

如果將itemController設置為App.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/的更新的小提琴

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM