我有一个下划线模板,它附加以下文本“[object HTMLDivElement]” ,但它应该附加“model.get('title')”返回的值。
这是我的模板:
<script type="text/template" id="todoTemplate">
<div class='todoBlock'>
<li class='appendedTodo'>
<%= title %>
</li>
<button class='delete'>Delete</button><p>
</div>
</script>
这是我的功能:
addTodoLi: function(model){
var todoData = model.get('title');
var compileTemplate = _.template( $('#todoTemplate').html() );
$('#todo-list').append( compileTemplate(todoData) );
},
最佳答案
您的todoData
(大概)是一个字符串:
var todoData = model.get('title');
但已编译Underscore template想要一个键/值对象作为其参数:
When you evaluate a template function, pass in a data object that has properties corresponding to the template's free variables.
看起来您有 title
全局变量或window
属性是 <div>
DOM 对象,否则你会得到一个 ReferenceError 提示未知的 title
变量而不是字符串化的 DOM 对象。
无论如何,修复都很简单:为模板函数提供它想要的内容:
$('#todo-list').append(compileTemplate({ title: todoData }));
或常见的 Backbone 方法:
$('#todo-list').append(compileTemplate(model.toJSON()));
在某些情况下,模型将具有模板需要访问的可选属性。在这种情况下,您可能会:
<%= pancakes %>
在模板中,但有时toJSON
会给你:
{ title: 'x' }
其他时候你会得到:
{ title: 'x', pancakes: 11 }
在这种情况下,您需要“取消可选” toJSON
中的可选属性:toJSON
应该供应一切。如果您有可选属性,则 toJSON
应确保它以 undefined
返回它们或null
值。
关于javascript - 下划线渲染 [对象 HTMLDivElement],我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20291756/