Question

我有一个如下所示的路由器：

App.Router.map(function() {
    this.resource("manage", function() {
        this.resource('services' , function() {
            this.route("new");
            this.route("edit", { path: '/edit/:service_id' } );
        });
    });
});

services.index路由从服务器加载模型：

App.ServicesIndexRoute = Ember.Route.extend({
    model: function() {  
        return this.store.find('service');
    }
});

返回：

{
  "services" : [ {
    "id" : 1,
    "serviceId" : "service1",
    "name" : "Service A"
  }, {
    "id" : 2,
    "serviceId" : "service2",
    "name" : "Service B"
  } ]
}

然后在services索引模板中，我列出了服务器返回的带有{{each}}循环的服务，如下所示：

<tbody>
    {{#each service in model}}
        <tr class="odd">
            <td>{{service.serviceId}}</td>
            <td>{{service.name}}</td>
            <td>{{#link-to 'services.edit' this}}Edit{{/link-to}} - <a href="#" {{action 'deleteService' this}}>Delete</a></td>
        </tr><!-- Table Row -->
    {{/each}}
</tbody>

问题是，当模板呈现时，它会用“undefined”替换路径段：

<a id="ember502" class="ember-view" href="#/manage/services/edit/undefined">Edit</a>

... deleteService方法传递一个对象，该对象具有两个服务的属性，而不是相关的服务实例。

然后我尝试了：

<tbody>
    {{#each}}
        <tr class="odd">
            <td>{{serviceId}}</td>
            <td>{{name}}</td>
            <td>{{#link-to 'services.edit' this}}Edit{{/link-to}} - <a href="#" {{action 'deleteService' this}}>Delete</a></td>
        </tr><!-- Table Row -->
    {{/each}}
</tbody>

并且有效！

我正在努力了解之前尝试中发生的事情。我正在尝试使用{{@each x in model}}语法，并想了解为什么this无法使用该设置......

我做错了什么？

谢谢！

Answer 1

如果您将this更改为service或任何您为迭代项目命名的内容，则应该有效。

{{#link-to 'services.edit' service}}Edit{{/link-to}}

就像JS一样，如果你用某个特定的上下文覆盖this（想想call, apply, bind, etc.），你需要考虑范围的变化。

Ember Handlebars模仿模板循环中的行为。如果为迭代对象指定特定名称，则this将变为未定义，因为上下文被赋予了名称。

Answer 2

问题是，{{#each x in model}}用于维护范围，这意味着您将能够从循环内访问模型上的任何内容，因此类似这样的内容适用于{{#each x在模型}}

{{#each service in model}}
  service.id
  service.name
  this.aVariableOnModel
{{/each}}

基本上，这仍然与模型有关，这非常有用，因此总是鼓励使用{{#each x in model}}语法。

所以，在你的情况下，这意味着..如果你这样做。

<td>{{#link-to 'services.edit' service}}Edit{{/link-to}} - <a href="#" {{action 'deleteService' this}}>Delete</a></td>

它会起作用。

干杯！

在使用{{#each x in model}}语法时，Ember的链接帮助器没有链接到正确的URL？

2 个答案: