2014-04-22 2 views
0

데이터를 사용하여 요소를 렌더링하는 샘플 작업을하고 있습니다. 그러나 나는 내 결과를 얻지 못하고있다. 여기서 뭐가 잘못 됐니?Backbone.Marionette -보기가 제대로 렌더링되지 않습니다.

하나 도와주세요.

여기가 내 코드입니다. 라이브 데모를 위해 바이올린을 찾으십시오.

는 HTML :

<div id="content" class="content"></div> 

<script type="text/template" id="list"> 
    <%= name %> 
</script> 

자바 스크립트 : 여기

var data = [ 
    {"name":"name1","city":"city1","age":"age1","subModel":[ 
     {"name":"name01","city":"city01","age":"age01","subModel":[ 
      {"name":"name001","city":"city001","age":"age001"} 
     ]}, 
     {"name":"name02","city":"city02","age":"age02","subModel":[ 
      {"name":"name002","city":"city002","age":"age002"} 
     ]}, 
     {"name":"name03","city":"city03","age":"age03","subModel":[ 
      {"name":"name003","city":"city003","age":"age003"} 
     ]} 
    ]} 
]; 

var myApp = new Backbone.Marionette.Application(); 


myApp.addRegions({ 
    mainRegion:"#content" 
}); 

var myModel = Backbone.Model.extend({ 
    defaults:{ 
     "name":"no name", 
     "city":"chennai", 
     "age":"10 months" 
    } 
}); 

var myCollection = Backbone.Collection.extend({ 
    model:myModel 
}); 

var oneView = Backbone.Marionette.ItemView.extend({ 
    tagName:"li", 
    template:"#list" 
}); 

var multiView = Backbone.Marionette.CompositeView.extend({ 
    tagName:'ul', 
    itemView:oneView 
}); 


myApp.on('initialize:after', function(){ 
    var listView = new multiView({collection:data}); 
    myApp.mainRegion.show(listView); 
}); 

myApp.start(); 

Live Demo

+0

당신은 바이올린을 언급했는데, 어디 있니? – Raptor

+0

죄송합니다. 실시간 데모를 추가했습니다. – 3gwebtrain

답변

1

당신은 이동 : http://jsfiddle.net/Cardiff/Y5kwM/

몇 가지 오류가 여기에 있습니다 :

,
var multiView = Backbone.Marionette.CompositeView.extend({ 
    tagName:'ul', 
    itemView:oneView 
}); 

템플릿을 compositeView에 제공해야하며, 그렇지 않으면 collectionview를 사용해야합니다.

var listView = new multiView({collection:data}); 

배열을 모음으로 설정할 수는 없습니다. 유효한 백본 컬렉션이 필요합니다 (바이올린 참조).

관련 문제