Cant가 backbone.js에서 mainview를 렌더링하는 것처럼 보입니다.

Question

저는 Backbone.js에서 비교적 새로운 것으로 학습용 앱을 제작하려고했습니다. 나는 보좌관 백본 생성기를 사용하고 MAINVIEW을 렌더링하는 동안, 이것은이 내 MainRouter.js 내 main.js

App = { 
    Models: {}, 
    Collections: {}, 
    Views: {}, 
    Routers: {}, 
    Adapters:{} 

}; 

$(document).ready(function() { 
    'use strict'; 
    App.routers = new App.Routers.MainRouter(); 
    Backbone.history.start(); 

}); 

입니다

TypeError: Object [object Object] has no method 'template' 

오류를 받고 계속 한

App.Routers = App.Routers || {}; 
    'use strict'; 
    App.Routers.MainRouter = Backbone.Router.extend({ 
     routes: { 
     "": "index", 
     "buildings/:id" : "buildingDetails", 
     "buildings/:id/map": "map" 
    }, 

    initialize: function(){ 
     App.slider = new PageSlider($('body')); 
    }, 

    index: function(){ 
     if(!App.mainView){ 
      App.mainView = new App.Views.MainView(); 
      console.log(App.mainView) 
      App.mainView.render(); 
      }else { 
      App.mainView.delegateEvents(); 
      } 
      App.slider.slidePage(App.mainView.$el); 
     }, 

buildingDetails: function(id){ 
     var building = new App.Models.BuildingModel({id: id}); 
      building.fetch({ 
      success: function(data){ 
       var buildingView = new App.Views.BuildingView({model: data}); 
       App.slider.slidePage(buildingView.render().$el); 
      }, 
      error: function(response){ 
       console.log(error,'There was some error in accessing data'); 
      } 

     }); 
    }, 

이것은 내 BuildingListView.js입니다.

App.Views = App.Views || {}; 
    App.Views.BuildingListView = Backbone.View.extend({ 
     tagName: 'ul', 
     template: JST['app/scripts/templates/BuildingListView.ejs'], 
     attributes: {class: 'topcoat-list list'}, 

     initialize: function(){ 
      this.model.on("reset", this.render, this); 
     }, 

     render: function(){ 
      this.$el.empty(); 
      _.each(this.model.models, function(building){ 
      App.singleBuildingListView = new App.Views.SingleBuildingListView({model: building}); 
       console.log(App.singleBuildingListView); 
       this.$el.append(App.singleBuildingListView.render().el); 
      }, this); 
      return this; 
     } 
    }); 

    App.Views.SingleBuildingListView = Backbone.View.extend({ 
     tagName: "li", 
     className: "topcoat-list__item", 

     initialize: function(){ 
      this.model.on("change", this.render, this); 
      this.model.on("destroy", this.close, this); 
     }, 

     render: function(){ 
      var html = this.template(this.model.attributes); 
      this.$el.html(html); 
      return this; 
     } 
    }); 

는 그리고 이것은 내가 특정 건물로 이동할 때마다 것은 예를 들면,

App.Views = App.Views || {}; 

    App.Views.MainView = Backbone.View.extend({ 

     template: JST['app/scripts/templates/MainView.ejs'], 

     initialize: function(){ 
      className: '.scroller', 
      this.buildingList = new App.Models.BuildingCollection(); 
      this.buildingList.fetch({reset: true, data:{name:""}}); 
      this.buildingListView = new App.Views.BuildingListView({model: this.buildingList}); 
     }, 

     render: function(){ 
      this.$el.html(this.template()); 
      this.$el.append(this.buildingListView.render().el); 
      return this; 
     } }); 

내 MainView.js입니다 http://localhost:8000/#buildings/1 또는 http://localhost:8000/#buildings/1/map이면 모든 것이 올바르게 작동하고지도가로드됩니다. 하지만 메인 뷰 자체를 탐색 할 때마다 작동하지 않으며 이유를 파악할 수 없습니다. 메인뷰에는 문제가있는 것 같아요.하지만 알아낼 수는 없어요. 이 문제에 대한 도움이나 제안은 감사하게 생각합니다. 감사합니다. 이 응용 프로그램의 전체 코드는 https://github.com/khyamay/uopTourGuide입니다.

Answer 1

SingleBuildingListView은 this.template을 사용하지만보기에 템플릿을 지정하지 않았습니다.