Ember.js并选择多个模型进行删除

Ember.js and selecting multiple models for deleting

本文关键字：模型 删除 js 选择 Ember      更新时间：2023-09-26

在余烬中.js我接下来找到的文档：

控制器允许您使用显示逻辑装饰模型。通常，模型将具有保存到服务器的属性，而控制器将具有应用不需要保存到服务器的属性。

我正在尝试向我的应用程序添加"选择"功能。

这是jsfiddle：http://jsfiddle.net/JWf7X/

似乎过滤器属性是按模型而不是按控制器过滤的（因为控制台.log为空）。

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

如何正确编写删除所选操作？

在控制器中存储"isSelected"的正确方法是什么？我认为为模型添加 isSelected 不是正确的方法，因为此属性不会通过 REST API 从服务器加载，也不会保存到服务器中。

应用.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,
});

索引.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，您将获得以下工作：

索引控制器： 

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

索引.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/的更新小提琴

相关文章：