如何仅在环氧树脂渲染功能内渲染一个视图

时间:2016-09-10 05:29:20

标签: javascript jquery backbone.js underscore.js marionette

我正在使用Backbone,Marionette,Epoxy,Underscore程序,而且我在渲染嵌套在Render()函数中的视图构造函数内的单个视图时遇到了问题。此函数内部还有3个其他视图,但是当调用构造函数时,我希望只能渲染CustomizationView。

我有办法做到这一点吗?

这是调用SettingsView的视图构造函数并在CustomerView

中呈现它的代码
render:function(){
            //renders all of the settings from the settings inclusion variable
            var data = this.viewModel.toJSON();
            data.customer = this.model.toJSON();
            this.$el.html(_.template(tmpl, data, {variable:'data'}));
            this.ui_settings = new settings.SettingsView({
            el: this.$('#vc-customer-settings'),
            model: this.model.get("_Settings")
             });
            this.applyBindings();
        }

这是settingsView构造函数中的render函数。我可以注释掉我不希望在CustomerView中看到的视图,但它可以工作,但随后它会破坏程序的其余部分。有没有什么办法可以在调用settings.SettingsView构造函数时获取CustomizationView模型?我显然想保留SettingsView,因为它包含了我需要的许多代码以及CustomizationView。

render:function(){
            this.$el.html(_.template(other_settings, {}, {variable:'args'}));

            this.ui_messages = new LIB.MessageCollectionView({
                el:this.$('.messages ul'),
                collection:this.model.get("_Messages"),
                parent: this
            });

            this.ui_customizations = new LIB.CustomizationCollectionView({
                el:this.$('.other-settings ul'),
                collection:this.model.get("_Customizations")
            });

            this.ui_increments = new LIB.IncrementCollectionView({
                el:this.$('.increments ul'),
                collection:this.model.get("_Increments")
            });

1 个答案:

答案 0 :(得分:0)

我解决了这个问题。我只是创建了一个名为adminRender()的新构造函数,然后在其中使用this.$el.html(_.template())的新html模板调用了CustomizationView构造函数。然后,当我在CustomerView内部实例化SettingsView类对象时,我为当前工作目录测试并创建了一个调用相应渲染函数的三元语句。它看起来像这样:

            adminRender:function(){
                this.$el.html(_.template(other_settings, {}, {variable: 'args'}));

                this.ui_customizations = new LIB.CustomizationCollectionView({
                    el:this.$('.other-settings ul'),
                    collection:this.model.get("_Customizations")
                });



                this.listenToOnce(this.model, 'change:Keymap', this.initKeymap);
                this.listenTo(this.model, 'keypressed', _.bind(this.replaceButton, this));
            },
            userRender:function(){
                this.$el.html(_.template(tmpl, {}, {variable:'args'}));

                this.ui_messages = new LIB.MessageCollectionView({
                    el:this.$('.messages ul'),
                    collection:this.model.get("_Messages"),
                    parent: this
                });
                this.ui_customizations = new LIB.CustomizationCollectionView({
                    el:this.$('.other-settings ul'),
                    collection:this.model.get("_Customizations")
                });

                this.ui_increments = new LIB.IncrementCollectionView({
                    el:this.$('.increments ul'),
                    collection:this.model.get("_Increments")
                });

然后在SettingsView构造函数中,我将调用相应的渲染函数,如下所示:

            var pathName = window.location.pathname;
            var pathName = "/admin/customers/new" ? view.adminRender() : view.userRender();

现在它有效!!!耶:)