设置控制器内容,无需模型钩子

时间:2013-06-05 10:00:13

标签: ember.js

我正在运行RC-3并且想要在没有模型钩子的情况下设置数组控制器的内容。这是因为我需要添加一些过滤,并且不希望在每次转换时重新加载内容。

我发现this.get('content')有时未定义。我不确定为什么会这样。这是代码:

App.StockRoute = Em.Route.extend({
  setupController: function(controller) {
    if (controller.get('content') === undefined) {
      controller.set('content', App.Stock.find());
    }
  }
});

模型钩子的setupController中的等效代码是什么?

更新 我已将此作为更全面的描述。

我参加了todo应用程序的余烬指南,然后建立了这个。目前我正在建立一个屏幕来管理/查看库存水平。 我正在尝试做什么有一个屏幕,我可以在其上切换所有/特价/超卖物品(根据待办事项,每个都有自己的路线),但随后在屏幕上我需要过滤列表,例如按名称或标签。要添加挑战,我会一直显示屏幕上的项目数量(全部,特殊和缺货),基于过滤器(想想名称或标签)但不在切换上显示(想想全部/特殊/缺货)

由于它基本上是一个屏幕,我在路线代码

中完成了以下操作
App.StockIndexRoute = Em.Route.extend({
  model: function() {
    return App.Stock.find();
  },
  setupController: function(controller) {
//    if (controller.get('content') === undefined) {
//      controller.set('content', App.Stock.find());
//    }
    // sync category filter from object outside controller (to match the 3 controllers)
    if (controller.get('category') != App.StockFilter.get('category')) {
      controller.set('category', App.StockFilter.get('category'));
      controller.set('categoryFilter', App.StockFilter.get('category'));
    }
    // a hack so that I can have the relevant toggle filter in the controller
    if (controller.toString().indexOf('StockIndexController') > 0) {
      controller.set('toggleFilter', function(stock) { return true; });
    }
  }
});

App.StockSpecialsRoute = App.StockIndexRoute.extend({
  setupController: function(controller) {
    this._super(controller);
    controller.set('toggleFilter', function(stock) {
      if (stock.get('onSpecial')) { return true; }
    });
  }
});

App.StockOutofstockRoute = App.StockIndexRoute.extend({
  setupController: function(controller) {
    this._super(controller);
    controller.set('toggleFilter', function(stock) {
      if (stock.get('quantity') === 0) { return true; }
    });
  }
});

您会看到路线的唯一区别是切换过滤器的定义,需要应用于模型(因为库存不同于库存/特殊库存或库存/库存)

我还没想出如何将一个控制器链接到多个路由,所以我在控制器端有以下内容

App.StockIndexController = Em.ArrayController.extend({
  categoryFilter: undefined,
  specialCount: function() {
    return this.get('content').filterProperty('onSpecial', true).get('length');
  }.property('@each.onSpecial'),
  outofstockCount: function() {
    return this.get('content').filterProperty('quantity', 0).get('length');
  }.property('@each.quantity'),
  totalCount: function() {
    return this.get('content').get('length');
  }.property('@each'),
  // this is a content proxy which holds the items displayed. We need this, since the 
  // numbering calculated above is based on all filtered tiems before toggles are added
  items: function() {
    Em.debug("Updating items based on toggled state");
    var items = this.get('content');
    if (this.get('toggleFilter') !== undefined) {
      items = this.get('content').filter(this.get('toggleFilter'));
    }
    return items;
  }.property('toggleFilter', '@each'),
  updateContent: function() {
    Em.debug("Updating content based on category filter");
    if (this.get('content').get('length') < 1) {
      return;
    }
    //TODO add filter
    this.set('content', content);
    // wrap this in a then to make sure data is loaded
    Em.debug("Got all categories, lets filter the items");
  }.observes('categoryFilter'),
  setCategoryFilter: function() {
    this.set('categoryFilter', this.get('category'));
    App.StockFilter.set('category', this.get('category'));
  }
});

// notice both these controllers inherit the above controller exactly
App.StockSpecialsController = App.StockIndexController.extend({});
App.StockOutofstockController = App.StockIndexController.extend({});

你有它。它相当复杂,也许是因为我不确定如何在余烬中正确地做到这一点。事实上,我有一个基于网址的切换和一个适用于这三条路线的过滤器,我认为是使这个非常复杂的部分。

任何人的想法?

1 个答案:

答案 0 :(得分:0)

您是否尝试使用某些数据为过滤器设定种子?

App.Stock.filter { page: 1 }, (data) -> data

这应该从商店中获取物化模型,并防止再次调用服务器。