2012-11-21 4 views
2

다음을 참조하십시오. fiddle.backbone.js 모델 컨텍스트를 가져 오지 않았습니다.

나는 기본 모드와보기 만 뷰에 대한 매개 변수가 템플릿에 의해 선택되지 않는를 만들었습니다

(function ($) { 
     var personTemplate= Handlebars.compile($("#person").html()); 

     var Person= Backbone.Model.extend({ 
      title: null, 
      firstname : "", 
      lastname : "" 
     }); 

     PersonView = Backbone.View.extend({ 
      tagName: "div", 
      template: personTemplate, 
      render: function() { 
       $(this.el).html(this.template(this.model)); 
       return this; 
      } 
     }); 

     $(document).ready(function() { 
     var AppView = Backbone.View.extend({ 
      initialize: function() {    
       var passView = new PersonView (
        { model: new Person({ title: "Mr", 
              firstname : "John", 
              lastname : "Smith"}) 
        }); 

       $('#people').append(passView.render().el.outerHTML); 
      } 
     }); 

     var App = new AppView(); 
    }); 
})(jQuery); 

HTML

<script id="person" type="text/x-handlebars-template">   
    <div>Title : {{title}} </div> 
    <div>First Name : {{firstname}}</div> 
    <div>Last Name : {{lastname}}</div>      
</script> 
<div id="people"></div> 

JS. 사람 모델에 직접 값을 설정하면 값을 찾습니다. 하지만 난 모드의 새로운 인스턴스를 통해 그들을 설정 (또는 내가 초기화 방법을 사용하는 경우에도()을 .SET하지 않는 경우.

내가 잘못 뭐하는 거지?

+0

당신의 모델에서'toJSON()'을 잊어 버린 것 같아요.'$ (this.el) .html (this.template (this.model.toJSON())); ' – Jack

+0

정확히 그것입니다! 그걸 대답으로 기록 할 수 있니? 감사! –

답변

1

을위한 객체를 얻기 위해 당신이 모델의 toJSON 메서드를 호출 할 필요가 템플릿으로 사용합니다. 예를

PersonView = Backbone.View.extend({ 
      tagName: "div", 
      template: personTemplate, 
      render: function() { 
       $(this.el).html(this.template(this.model.toJSON())); 
       return this; 
      } 
     }); 

당신이 방화범에 모델 중 하나 (또는 ​​콘솔에 그것은 단지 출력)를 검사하는 경우에 대한

을 당신은 알 수가있다 당신이 지정한 것보다 더 많은 속성이 있습니다. 그리고 t 모자 지정한 값이 속성 속성에 실제로 포함되어있는 경우 toJSON을 호출하면 지정한 값 ""의 개체가 반환됩니다.

관련 문제