与通过单个视图呈现多个视图相关的问题

时间:2013-09-20 13:00:15

标签: backbone.js backbone-views backbone-routing

问题已更新

  

我正在同一页面中实现相同的搜索和结果。一世   有两个单独的HTML视图和视图搜索和结果。   这是正在发生的事情..

从我的路由器加载以下视图。此视图将加载另外两个名为search和result的视图。我已将相应的html视图包含在单独的视图中。但是当我运行proj时,它什么也没显示。

  1. 我在这个文件中渲染视图错了吗?
  2. 如果我说错了,有人可以告诉我错误在哪里以及如何纠正它?
  3. 我应该在搜索结果中包含相应的html模板吗?
  4. views.driver.search.js:

    define(
        [ 'jquery',
          'underscore',
          'backbone',
          'app/models/model.driver',
          'app/collections/collection.driver',
          'app/models/model.driver.searchform',
          'app/dashboard/views.driver.searchForm',
          'app/models/model.driver.searchresult',
          'app/dashboard/views.driver.searchResults',
    
          ],
    
    function ($, _, Backbone, DriverModel,SearchResultCollection ,searchFormModel, searchFormView, SearchResultModel,SearchResultView) {
        var DriverSearchView = Backbone.View.extend({
            el: $('#content'),
    
            initialize: function(){
                this.render();
            },
    
            render: function () {
    
    //              var compiledTemplate = _.template(searchFormTemplate, {});
    //                this.$el.html(compiledTemplate);
    
                this.searchFormInitModel = new searchFormModel();   
                var searchformView = new searchFormView({model:this.searchFormInitModel});
                this.$("#content").html(searchformView.render());
    
                var driver1 = new DriverModel({id:1,firstName:"driver1",lastName:'last',dob:'12/12/12001',});
                var driver2 = new DriverModel({id:2,firstName:"driver2",lastName:'last',dob:'12/12/12001',});
                var driver3 = new DriverModel({id:3,firstName:"driver3",lastName:'last',dob:'12/12/12001',});
                var driver4 = new DriverModel({id:4,firstName:"driver3",lastName:'last',dob:'12/12/12001',});
    
                this.searchResultCollection= new SearchResultCollection([driver1, driver2, driver3, driver4]);
                var searchResultView = new SearchResultView({el:this.$el.find("#searchResult"),collection:this.searchResultCollection});
                this.$("#content").html(searchResultView.render());
    
                //this.$el.find("#searchResult").html(searchResultView.render());
             }
    
        }); // Our module now returns our view 
        return DriverSearchView;
    });
    

1 个答案:

答案 0 :(得分:1)

我发现您的工作流程没有问题。您没有看到console.logs的原因是因为您返回的是包含初始化函数的对象文字而没有实际调用该函数。您是否需要从初始化模块返回对象?

无论如何,我不完全确定你如何调用app.js文件,但如果你不需要从初始化模块返回一个对象,请尝试以下方法

define(
[
 'jquery',
 'underscore',
 'backbone',
 'app/router',
// 'datatable'
],
function ($, _, backbone, router){   //,datatable) {

    var initialize = (function () {

        console.log("App1");
        debugger;
        console.log("App2");
        router.initialize();
        console.log("App3");
    })();

   // Depending what you want to do here, you could just
   // console.log("Router initialized...");
   // router.initialize();

});