ember.js - linkTo 生成指向/<App.Object :ID>, 而非/ID 的 href

Question

不幸的是，Ember 指南 ( http://emberjs.com/guides/templates/links/ ) 中的链接示例对我来说不起作用。

要显示临时工列表，并为每个临时工提供详细信息页面的链接，我使用以下代码:

HTML:

<script type="text/x-handlebars" data-template-name="tempworkers">
  <div>
    {{#each controller }}  
      <tr>
        <td>{{#linkTo 'tempworker' this}} {{firstname}} {{/linkTo}}</td>
        <td>{{initials}}</td>
        <td>{{completeSurname}}</td>
      </tr>
    {{/each}}
  </div>
</script>

<script type="text/x-handlebars" data-template-name="tempworker">
  <div id="tempworker">
    <p>{{view Ember.TextField valueBinding='firstname'}}</p>
    <p>{{view Ember.TextField valueBinding='initials'}}</p>
    <p>{{view Ember.TextField valueBinding='surnamePrefix'}}</p>
    <p>{{view Ember.TextField valueBinding='surname'}}</p>
  </div>
</script>

Javascript:

window.App = Ember.Application.create({
    LOG_TRANSITIONS: true,
    ENV.EXPERIMENTAL_CONTROL_HELPER = true;
});

App.Store = DS.Store.extend({
    revision    : 11,
    adapter     : DS.RESTAdapter.extend({
        url     : 'http://dev.start.flexplanners.com/api'
    })
});

App.Router.map(function() {
    this.route('tempworkers'); // /tempworkers
    this.route('tempworker', { path: '/tempworkers/:id' }); // /tempworkers/:id
});

App.TempworkersRoute = Ember.Route.extend({
    model : function() {
        return App.Tempworker.find(); // return All tempworkers to the TempworkersController
    }
});

/* TODO: Question -> According to http://emberjs.com/guides/routing/defining-your-routes/, this should be working by convention, and NOT explicitely defined here?
 * But when I leave it out, it's broken :(
 * */
App.TempworkerRoute = Ember.Route.extend({
    model : function(params) {
        return App.Tempworker.find(params.id); // return tempworker by id to the TempworkerController
    }
});

用例:

When I visit the URL /tempworkers, the app fires a request 
to my server API, and return the list in my tempworkers view.

When I visit the URL /tempworkers/[UUID], the app fires a 
request to my server API, and return the requested tempworker 
in my tempworker view.

When I click a generated link in the list of tempworkers, the app routes me 
to /tempworkers/<App.Tempworker:ember343:47cfa9f2159d45758ceacc4c15ae1671>, 
and shows the details in my tempworker view

我的问题如下:

1) 这 3 个用例是否显示了预期的行为？

2) 如果是，这是否显示 2 种状态之间的区别，1 是新的 URL 访问(包括服务器 API 调用)，1 转换到另一个 View ，并解析对列表中单个对象的引用？

3)如果是，什么时候重新加载列表并更新列表中的项目？

4) 如果不是，我如何才能让链接生成“/tempworkers/[UUID]”之类的 href，并让应用程序进行服务器 API 调用以获取临时 worker 的详细信息？

预先感谢您的宝贵时间!

雷纳。

Answer 1

您做得对，只是输入错误，您的路线需要是 /tempworker/:tempworker_id。

App.Router.map(function() {
  this.route('tempworkers'); // /tempworkers
  this.route('tempworker', { path: '/tempworkers/:tempworker_id' }); // /tempworkers/:id
});

Ember 在查找要反序列化的模型时使用提供的动态 key 。