2

我开始在现有的主干应用程序中使用 Marionette。我有一些 HTML 想要附加到一个区域中。在纯粹的骨干中，我可以做到this.$el.append(html_code)，仅此而已。据我所知，木偶区域只允许对视图进行操作（必须实现该render方法）。调用append木偶区域会引发“未定义方法”错误。

是否可以将纯 HTML 附加到木偶区域？

4

4 回答 4

3

不，不可能将纯 html 注入Marionette.Region。

someRegion.el从理论上讲，您可以使用or访问区域 DOM 元素someRegion.getElement()，但这必须在渲染后完成（至少在具有标准行为的Marionette.View中是不可能的）。

但是您可以通过使用特制的Marionette.ItemView来达到预期的效果：

@someRegion.show(new Marionette.ItemView({template: '<h1>gach</h1>'}));

您也许还应该看看Marionette.Renderer 。

于 2015-01-23T11:10:32.670 回答
1

Marionette ItemView 将查找模板并在该模板上调用渲染，因此当您在区域中显示视图时，html 将很好地显示，而无需您定义渲染方法。

MyImtemView = Backbone.Marionete.ItemView.extend({
    template : "#myTemplate"  
});

var myItemView = new MyItemView();
myLayout.aregion.show(myItemview);

如果您将 html 保存在这样的模板中，这应该可以工作

`<script id="myTemplate" type="text/template">
  <div><p>your html<p>
  </div>

`

编辑

您还可以在视图中声明一个渲染函数，以防您需要像这样生成和修改您的 html。

MyImtemView = Backbone.Marionete.ItemView.extend({
    template : "#myTemplate",
    render : function (){
       this.$el.append(HMTL); //so here you work your html as you need


    }
});

var myItemView = new MyItemView();
myLayout.aregion.show(myItemview); //the render function of your view will be called here
于 2013-06-05T18:54:04.180 回答
1

我遇到了同样的问题并尝试了此处解释的答案，但我也在使用 require.js 并不断收到找不到 #my_view 模板的错误。如果有人能澄清 Marionette 默认在哪里查找模板，那就太好了。

相反，我使用 underscore.js 的 text.js 插件解决了这个问题。这样，您实际上可以使用纯 html 文件作为模板，而无需将其嵌套在脚本标签中。这就是我的做法。

define(['backbone', 'underscore', 'marionette', 'text!tmpl/my_view.html'], function(Backbone, _, Marionette, view_t){

    var MyView = Backbone.Marionette.ItemView.extend({

        template : function(serialized_model) {
            //define your parameters here
            param1 = erialized_model.param1;

            return _.template(view_t)({
                param1: param1
            });
        }
    });
    return MyView;
});

我将 text.js 插件放置在与所有其他 js 库相同的 lib 目录中，并且我的 main.js for require 将模板的路径声明为

'tmpl':     '../../templates',

我的项目结构是这样的

root
    index.html
    js
        main.js
        app
             App.js
             views
                 MyView.js
        lib
            require.js
            text.js
            backbone.js
            underscore.js
            jquery.js
            backbone.marionette.js
    templates
        my_view.html

我的模板“my_view.html”看起来像这样。

<h1>THIS IS FROM THE TEMPLATE!!!</h1>

工作完美。希望对你有帮助。

于 2015-01-24T22:37:11.343 回答
0

使用视图

var myHtml = '<h1>Hello world!</h1>';
var myView = new Marionette.ItemView({template: _.constant(myHtml)});
myRegion.show(myView);

Marionette.Renderer.render采用函数或模板的名称（源代码）。_.constant创建一个返回传入参数的函数。

附加 HTML

或者，Marionette.Region提到覆盖该attachHtml方法的文档，请参阅Set How View's el Is Attached。

于 2016-07-10T21:31:32.323 回答