如何在ember.js路由中显示模型的非id字段的字符串值?

时间:2013-03-13 00:54:54

标签: ember.js

我有一个自定义字段,允许您过滤模型列表(在某些ArrayController上可以说)

  PersonApp.SearchField = Ember.TextField.extend({
      keyUp: function(e) {
          var search = this.get('value');
          model = PersonApp.Page.create({term: search});
          this.get('controller.target').transitionTo('person.search', model);       
      }
  });

这是我用于分页和过滤/搜索的非常简单的模型

  PersonApp.Page = Ember.Object.extend({                                            
      term: ''
  });

我添加了一条适用于上述模型的简单路线

  PersonApp.Router.map(function(match) {
      this.resource("person", { path: "/" }, function() {
          this.route("page", { path: "/page/:page_id" });
          this.route("search", { path: "/search/:page_term" });                     
      });
  });

最后这是我的路由setupController方法

 PersonApp.PersonSearchRoute = Ember.Route.extend({
     setupController: function(controller, model) {
         this.controllerFor('person').set('filterBy', model.get('term'));
     }
 });

过滤器确实有效(意味着它使用上面的setupController中的filterBy修改了ArrayController)。

但在网址中我看到以下内容

http://www.google.com/#/search/<PersonApp.Page:ember517>

而不是

http://www.google.com/#/search/foo

我可以修改model / route / setupController以显示文本吗?

此外 - 如果像这样的东西只是索引/主路线上的一个简单的“事件”而不是我上面的自定义路线?如果是这样,我仍然可以修改网址(我假设没有 - 所以这就是为什么我现在把它作为一条路线)

1 个答案:

答案 0 :(得分:3)

您需要使用serialize中的PersonSearchRoute挂钩。根据{{​​3}},serialize是:

  

您可以实现将路径模型转换为URL参数的钩子。

对于你的例子:

PersonApp.PersonSearchRoute = Ember.Route.extend({
  setupController: function(controller, model) {
    this.controllerFor('person').set('filterBy', model.get('term'));
  },
  model: function(params) {
    return PersonApp.Page.create({term: params.page_term});
  },
  serialize: function(model) {
    return { page_term: model.term };
  }
});

serialize docs

这将显示正确的网址:#/search/foo但是如果您直接导航到该网址,或者刷新该网址,则需要使用model挂钩来查找并返回模型提供的动态参数。从model挂钩返回的值是直接导航到网址时传递到model的{​​{1}}参数,但是如果使用了setupControllertransitionTo与这些调用一起传递的对象直接传递给{{#linkTo}}