javascript - ember 中的动态路由显示父模型而不是它自己的模型

Question

我正在尝试创建一个从颜色列表到单一颜色的简单路径。不幸的是，一旦您导航到 colors/:color，即 colors/red，该模型不会覆盖单个模型的属性，并且仍然反射(reflect)颜色列表。

我如何才能正确地深入到单个模型？

路线:

App.ColorsRoute = Ember.Route.extend({
  model: function() {
    return this.store.findAll('color');
  }
});

App.ColorRoute = Ember.Route.extend({
  model: function(params) {
    console.log(params);
    return this.store.findBy("color", params.colors_id);
  }
});

路由器:

App.Router.map(function() {
  this.resource("colors", function(){
    this.resource("color", {path: "/:colors_id"});
  });
});

jsbin 中重现的问题:http://jsbin.com/sipexu/3/edit

Answer 1

有几件事对您不起作用 - 我这里有一个可用的 jsbin:http://jsbin.com/xejik/1

首先，“colors”下有一个未声明的“index”路由。既然你有那个模板，你应该在 map 调用中包含一个空函数:

App.Router.map(function() {
  this.resource("colors", function(){
    this.resource("color", {path: "/:colors_id"}, function() {});
  });
});

我还更改了“颜色”模板以显示颜色名称。您的 link-to 引用了 this，而不是 item:

{{#each item in model}}
    <li>{{#link-to "color" item}}{{item.color}}{{/link-to}}</li>
{{/each}}

您可以在此处阅读更多相关信息(功能？问题？):http://discuss.emberjs.com/t/index-route-puzzle/5965