Ember JS - Handlebars模板 - @index在#each中未定义

Question

我找了一个重复的问题,但在SO上找不到.因此它就在这里.

我的#each模板中有一个块,它成功地从数组中打印了值,但是当我尝试@index在这个块中使用这样的当前索引时{{@index}},它是未定义的.

从官方车把文档中我发现了获取当前索引的方法.

路由器(router.js):

Router.map(function() {
    this.resource("books", function(){
        this.route("about", { path : "/:bookId"}, function(){

        });
    });
});

路线(routes/books.js):

var BooksRoute = Em.Route.extend({
    model: function() {
        return [{
            name: "Harry Potter & The Deathly Hallows"
        }, {
            name: "What If?"
        }, {
            name: "Diary of a Wimpy Kid"
        }, {
            name: "The Martian"
        }];
    }
});

export default BooksRoute;

模板(templates/books/index.hbs):

<div class="page-header">
    <h1>All Books!</h1>
    <ul>
        {{#each book in model}}
            {{@index}}
            <li>{{#link-to "books.about"}} {{book.name}} {{/link-to}}</li>
        {{/each}}
    </ul>
</div>

我希望能够做的是生成每本书的链接,当前索引用作:bookId例如/books/1.

我的代码有什么问题吗？我怎样才能使它工作？

更新: 我也试过{{#each model as |book index|}}没有运气.

它适用于{{#each model as |book index|}}.问题是我在做{{@index}}而不是{{index}}采用新方法.

Answer 1

由于ember 1.11.0索引支持已经添加到每个帮助器中.你可以像使用它一样

{{#each model as |book index|}}
  {{index}}
        <li>{{#link-to "books.about" index}} {{book.name}} {{/link-to}}</li>
{{/each}}

这是一个工作演示.