如果我使用 renderTemplate 如何在 ember 中刷新路由？

Question

我的两条路线具有相同的模板和控制器，因此我的路线希望使用 renderTemplate 相同的模板和控制器，例如：

OrderRoute = Ember.Route.extend 
  model: (params)->  
    Product.findAll(params)

  setupController: (controller, model)->
    @controllerFor('product').set('model', model)

  renderTemplate: ->
    @render 'products',
      controller: 'products'

  actions:
    queryParamsDidChange: ->
      @refresh()

控制器：

ProductController = Ember.Controller.extend
  queryParams: ['number']

  number: null

代码看起来没问题，但是当我使用时我发现query params无法工作。

jsbin： http ://emberjs.jsbin.com/gegonemadu/1/edit

我无法用谷歌搜索任何关于这个问题的信息。

我知道如果我使用OrderRoute和OrderController路由和控制器具有相同的名称，所有的想法都会好的。 但我的 2 条路线想要具有相同的模板，就像：

/命令
/其他
2 路由 url 使用product模板和控制器

我正在使用{{partial}} ，就像： http : //emberjs.jsbin.com/bifanateku/1/edit?html,js,console

这是可以工作的，但我认为如果我可以使用renderTemplate代码会更清晰。

也许有更好的方法来解决这个问题？

Answer 1

对于查询参数，控制器和路由应该一起工作。

在您的情况下，您正在使用order路由，该路由需要来自您没有的order控制器的查询参数。

所以你要么为路由定义一个不同的控制器，例如

contollerName: 'product',

或者将查询参数定义移动到order控制器并将它们绑定到product控制器的属性。

这是一个毛茸茸的设置，我相信你可能首先做错了什么。

更新 1

您不应该为此使用控制器。 使用组件。

Ember 正在弃用控制器并仅使用组件。 但就目前而言，控制器仍然是您页面的入口点。 剩下的应该是组件！

以下是您应该如何做：

App.Router.map(function() {
  this.route('foo');
  this.route('bar')
});


App.FooController = Ember.Controller.extend({
  queryParams: ['number'],
  number: null
});


App.BarController = Ember.Controller.extend({
  queryParams: ['number'],
  number: null
});

  <script type="text/x-handlebars" data-template-name="foo">
    {{x-product number=number}}
  </script>


  <script type="text/x-handlebars" data-template-name="bar">
    {{x-product number=number}}
  </script>


  <script type="text/x-handlebars" data-template-name="components/x-product">
    Search Product:
    {{input value=number}}

    <ul>
      {{#each model}}
        <li>{{this}}</li>
      {{/each}}
    </ul>
  </script>

演示： http : //emberjs.jsbin.com/xixeto/1/edit?html,js,output