2012-02-12 7 views
7

무엇이 잘못되었는지 알 수 없습니다. 모델 제목을 클릭하면 하나의 모델을 가져 오는 대신 컬렉션의 모든 모델을 한 번에 가져옵니다. 이 이벤트를 logView에서 logsView로 이동하면 제대로 작동하지만 모델에 액세스 할 수 없으므로 인덱스 나 다른 모델의 ID를 사용하여이 모델을 찾을 수 있지만 좋은 방법이라고 생각하지는 않습니다.백본 클릭 이벤트는 모델이 아닌 모든 컬렉션에 대한 이벤트를 발생시킵니다.

var Log = Backbone.Model.extend({}); 


window.LogsList = Backbone.Collection.extend({ 
    model:Log, 

    url:function (tag) { 
     this.url = '/logs/' + tag; 
     return this; 
    } 
}); 

window.colList = new LogsList(); 

window.logView = Backbone.View.extend({ 
    el:$('.accordion'), 

    template:_.template($('#log').html()), 

    initialize:function() { 
     this.model.bind('add', this.render, this); 
    }, 

    events:{ 
     "click .accordion-toggle" :"getLogBody" 
    }, 

    render:function() { 
     return this.template(this.model.toJSON()); 
    }, 

    getLogBody:function() { 
     this.model.fetch(); 
    } 
}); 

window.LogsView = Backbone.View.extend({ 
    el:$("#content"), 

    initialize:function (options) { 
     colList.bind('reset', this.addAll, this); 
     colList.url(options.data).fetch(); 
    }, 

    addOne:function (model) { 
     var view = new logView({model:model}); 
     $("#accordion").append(view.render()); 
    }, 

    addAll:function() { 
     colList.each(this.addOne); 
    } 
}); 

window.listView = new LogsView({data:"Visa_Cl"}); 

답변

10

문제는 LogView의에 el에 의해 발생합니다 : el:$('.accordion')

백본의 뷰 이벤트는 뷰의 el에 범위입니다. 이 경우보기의 elALL HTML 요소에 "accordion"으로 지정했습니다. 따라서이 클래스를 사용하여 개의 HTML 요소를 클릭하면 코드가 모두 실행되므로이 ​​동작이 표시됩니다. 당신이 원하는

이 문서가 올바르게, 당신을 수행하기위한 몇 가지 옵션이 표시됩니다 :

나는 또한 더 나은 백본에서 el의 사용을 이해하는이 하나를 읽어 보시기 바랍니다 것이다 그리고 그것의 트릭과 함정의 몇 :

+0

감사합니다. 나는 그걸로 혼란스러워했다고 생각합니다. – nateless

+0

고마워요! 우수한 자원! –

+0

고마워요. 내가 필요한 것. –

관련 문제