Question

我有一个带有路由器和控制器的Backbone Marionette应用程序。在我的应用程序中，您可以查看文本集合（带有从服务器获取集合的索引路径），可以查看现有文本集合（无需从服务器获取索引页面路径）并可以创建新文本（表单路径）。列表文本和创建表单的视图彼此不同以及区域中的更改。

我想将一个成功保存的模型添加到集合中，然后重定向到indexPage路由，但是从_FormView成功回调获取文本集合的最佳方法是什么？或者如何重新构建应用程序以简化操作？

我可以使用Backbone.Radio向控制器发送事件，但想要在没有它的情况下进行处理。

路线

router.processAppRoutes(controller, {
    '': 'index',
    'index': 'indexPage',
    'create': 'form'
});

控制器

_Controller = Marionette.Controller.extend({
    initialize: function () {
        this.list = new _MainTexts();
    },
    index: function () {
        if (!_.size(this.list)) {

            var
            self = this;

            this.list.fetch({

                success: function (collection, response, options) {
                    self.indexPage();
                    return;
                }
            });
        }
        this.indexPage();
    },
    indexPage: function () {

        var
        textsView = new _TextsView({
            collection: this.list
        });
        application.getRegion('contentRegion').show(textsView);
    },
    form: function () {

        var
        formView = new _FormView({
            model: new _MainText()
        });
        application.getRegion('contentRegion').show(formView);
    }
});

浏览

_TextView = Marionette.ItemView.extend({

    className: 'item text',
    template: function (serialized_model) {
        return _.template('<p><%= texts[0].text %></p>')(serialized_model);
    }
});

_TextsView = Marionette.CollectionView.extend({
    className: 'clearfix',
    childView: _TextView
});

表单视图

_FormView = Marionette.ItemView.extend({
    template: '#form-template',
    ui: {
        text: 'textarea[name="text"]',
        submit: 'button[type="submit"]'
    },
    events: {
        'click @ui.submit': 'submitForm'
    },
    submitForm: function (event) {

        event.preventDefault();
        this.model.set({

            text: this.ui.text.val()
        });

        this.model.save({}, {
            success: function (model, response, options) {

                ???
            }
        });
    }
});

Answer 1

好的，我的问题解决方案就在这里。在控制器动作＆＃34;形式＆＃34;我创建了事件监听器

var
formView = new _FormView({

    model: model
});

formView.on('formSave', function (model) {

    if (id == null) {

        self.list.add(model);
    }

    ...
});

然后在表单视图中我触发事件

this.model.save({}, {

    success: function (model, response, options) {

        if (response.state.success) {

            self.trigger('formSave', model);
        }
    }
});

全部：）

从视图中添加模型的最佳方法是什么？

1 个答案: