3

不幸的是，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 是转换到另一个视图，并引用列表中的单个对象进行解析？

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

4）如果没有，我将如何让linkTo生成像'/tempworkers/[UUID]'这样的href，并让应用程序进行服务器API调用以获取tempworker的详细信息？

在此先感谢您的时间！

雷纳。

4

1 回答 1

2

你做得对，你刚刚打错了，你的路线需要是/tempworker/:tempworker_id.

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

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

于 2013-04-04T11:43:55.360 回答