mooml 模板在尝试渲染时返回 null

Question

我正在尝试渲染我即时创建的 mooml 模板，但当我调用 render 时，结果为 null。

这是我的代码：

var myTpl = Mooml.Template('tpl', function() {
  div({class: 'new-container'},
    div({class: 'new-title'},
      div({class: 'new-text'},
        'Put your title here:'
      ),
      div({class: 'new-input'},
        input({type: 'text', name: 'title', class: 'required', title: 'Title'})
      )
    ),
    div({class: 'new-content'},
      form({method: 'post', action: '#'},
        textarea({name: 'content', style: 'width: 100%'})
      )
    )
  );
});

// el is null after executing render
var el = myTpl.render(); 

我查看了 firebug 中的一些变量，发现 myTpl var 不为 null，render 方法也不为 null。我不太了解 mooml 在幕后所做的事情，但我认为我所拥有的应该可以工作，给出以下示例，该示例被发现 这里：

var template = new Mooml.Template('mytemplate', function() {
    div('Template on the fly');
});

template.render(); // returns <div>Template on the fly</div>

一如既往，非常感谢任何帮助。

Answer 1

嘿，我在看这个时经历了一段可怕的时间，主要是因为你的嵌套标签写得如此混乱，并且寻找不匹配/语法错误，这让我忽略了你未能正确插入类的事实。

var foo = new Mooml.Template('tpl', function() {
    div({"class": 'new-container'},
        div({"class": 'new-title'},
            div({"class": 'new-text'}, 'Put your title here:'),
            div({"class": 'new-input'},
                input({
                      type: 'text',
                      name: 'title',
                      "class": 'required',
                      title: 'Title'
                })
            )
        ),
        div({"class": 'new-content'},
            form({method: 'post', action: '#'},
                textarea({
                    name: 'content',
                    style: 'width: 100%'
                })
            ) // form
        ) // new-content
    ); // end div function
}).render();

foo.inject(document.body);

这有效。 http://jsfiddle.net/YKTyL/2/

注意新的 Mooml.Template 而不是传递对类本身的引用。它就在正确的示例中注视着我们...

另外，我更改了您说 class 的实例：class 之类的东西是 IE 中的保留关键字，需要在“”中引用