백본이있는보기에 컬렉션 항목 수 표시

Question

컬렉션에있는 항목 수를 표시하려면 어떻게합니까? collection.models.length 또는 collection.length을 사용하려고했습니다. 심지어 Backbone.Collection에 count()이라는 메서드를 만들어서 컬렉션의 길이를 반환하기는했지만 아무 일도 일어나지 않습니다.

템플릿 :

<p>you have <span class="caller-num">0</span> missed calls.</p> 

컬렉션 :

// callers collection 
define([ 
'jquery', 
'underscore', 
'backbone', 
'models/caller' 
], function($, _, Backbone, Caller) { 

    var CallersList = Backbone.Collection.extend({ 
    model: Caller, 
    url: 'js/json/callers.json', 

    // had to do this because it's the 'callers' key that has the array of objects, the json 
    parse: function(data) { 
     return data.callers; 
    }, 

    count: function() { 
     return this.length; 
    } 
    }); 

    return CallersList; 

}); 

부재 중 전화가보기 :

define([ 
'jquery', 
'underscore', 
'backbone', 
'collections/callers-list', 
'views/callers-view', 
'views/missed-called-num-view' 
], function($, _, Backbone, CallersList, CallersView, MissedCallsNumberView) { 

    var AppView = Backbone.View.extend({ 
    el: '.app', 

    initialize: function() { 
     _.bindAll(this, 'render'); 
     this.render(); 

     var callers = new CallersList; 
     callers.fetch({ reset: true }); 
     this.$el.find('.caller-num').text(callers.models.length); 
    }, 

    render: function() { 
     var callersView = new CallersView({ collection: CallersList }), 
      mcn = new MissedCallsNumberView({ collection: CallersList }); 

     this.$el.append(callersView.render().el); 
     this.$el.find('header').append(mcn.render().el); 
    } 
    }); 

    return AppView; 

}); 

,691 : 부재중 전화

define([ 
'jquery', 
'underscore', 
'backbone', 
'collections/callers-list', 
'text!templates/missed-calls-number-template.html' 
], function($, _, Backbone, CallersList, missedCallsNumTemplate) { 

    var MissedCallsNumberView = Backbone.View.extend({ 
    el: '.number-of-callers', 
    template: _.template(missedCallsNumTemplate), 

    initialize: function() { 

     var callers = new CallersList; 
     this.$el.find('.caller-num').text(callers.count()); 
     //this.$el.find('.caller-num').text($('.caller').length); /* this doesn't work either */ 
    }, 

    render: function() { 
     this.$el.html(this.template(this.model)); 

     return this; 
    } 
    }); 

    return MissedCallsNumberView; 

}); 

앱 조회 수를 보여주는

Answer 1

내가 문제가 당신이보기의 초기화에 새 컬렉션을 만들 것입니다 생각 MissedCallsNumberView

render: function() { 
    this.$el.html(this.template(this.model)); 
    this.$el.find('.caller-num').text(callers.length); 
    return this; 
} 

의 렌더링 방법 컬렉션에 작동합니다. 보기를 만들 때 전달한 컬렉션을 원할 수도 있습니다.