Question

使用Ember.Handlebars，我试图设置一个Bootstrap轮播来展示我的数据存储中的一系列问题。

我想在我的轮播的第一项上添加active类，但听起来好像我的 {{if @first}} 测试从未被评估为真

我的app/templates/issues-list.hbs是：

<div id="showcase-issues" class="carousel slide">
    <div class="carousel-inner">
        {{#each model.issues as |issue|}}

            {{#if @first}}
            <div class="active item">
                {{#issue-item issue=issue}}{{body}}{{/issue-item}}
            </div>
            {{else}}
            <div class="item">
                {{#issue-item issue=issue}}{{body}}{{/issue-item}}
            </div>
            {{/if}}

        {{/each}}
    </div>
    {{!-- Nav buttons, etc. ... --}}
</div>

我的app/routes/issues-list.js只是：

model: function() {

    var issues = this.get('store').filter('issue', {
        filters: { "state" : "visible" }
    }, function(item) {
        return (item.get('state') === "visible") ;
    }).then( function(results) {
        return results ;
    }) ;

    return Ember.RSVP.hash({issues: issues}) ;
}

有没有人已经面临这个问题？

是否有正确的方法在 DS.FilteredRecordArray 帮助中处理 {{#each ...}} ？

我正在使用：

Ember 1.13.2
Ember-data 1.13.5
Bootstrap 3.3.5

非常感谢任何给定的手！

Answer 1

@index and @first isn't available in htmlbars. You can however:

{{#each model.issues as |issue index|}}
  <div class="item {{unless index 'active'}}">
    {{#issue-item issue=issue}}{{body}}{{/issue-item}}
  </div>
{{/each}}

See: http://jsbin.com/zupezap/2/edit?html,css,js,output

为什么@first在我的把手#each循环中总是假的？

1 个答案: