与通过单个视图渲染多个视图相关的问题答案

【问题标题】：Issue related to rendering multiple views through a single view与通过单个视图渲染多个视图相关的问题
【发布时间】：2013-09-20 13:00:14
【问题描述】：

问题已更新

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

从我的路由器加载了下面的视图。此视图将加载另外两个称为搜索和结果的视图。我在单独的视图中包含了各自的 html 视图。但是当我运行项目时，它什么也没显示。

我在这个文件中渲染视图是否错误？？
如果我呈现错误，谁能告诉我错误在哪里以及如何纠正它？？
我是否应该在这个文件中也包含搜索和结果的相应 html 模板？？

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;
});

【问题讨论】：

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

【解决方案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();

});

【讨论】：