[英]Uncaught TypeError: Cannot call method 'replace' of undefined underscore.js
I'm newbie to backbone.js
and underscore.js
. 我是
backbone.js
和underscore.js
新手。
HTML : HTML:
<div id="cartlist">
<script type="text/template" id="cart_template">
</script>
</div>
Where I called the view file : 我在哪里调用了视图文件:
<script type="text/javascript" src="webcore/views/CartView.js"></script>
</body>
JS function(it works well with the javascript project): JS函数(它适用于javascript项目):
function Cart(){
......
this.showCart = function (){
var item = deserializeJSONToObj(window.localStorage.getItem(Cart.storageName));
var str = '<table id="showcart">';
str += '<tr><td class="cartitemhead">Item to buy</td><td class="cartitemhead" style="text-align: center;">Quantity</td></tr>';
$.each(item, function(i, item) {
str += '<tr><td><table class="verticallist"><tr><td rowspan="4" style="width: 120px;"><img src="' + item.PictureName + '" alt="Product" width="95px"/></td><td style="font-weight: bold;">'+trimString(item.Name,50)+'</td></tr><tr><td><i>Available in Stock(s)!</i></td></tr><tr><td><i>Rating: 650Va-390w Input: Single</i></td></tr></table></td><td class="centertxt">'+item.QuantityInCart+'</td></tr>';
});
str += '</table>';
return str;
}
This is the Views : 这是视图:
var myCart = new Cart();
CartList = Backbone.View.extend({
initialize:function(){
this.render();
},
render: function(){
var template = _.template( $("#cart_template").html(), {} );
this.$el.html( template );
}
});
var cart_view = new CartList({ el: $("#cartlist").html(myCart.showCart()) });
when I trying to call the view template, I am getting error Uncaught TypeError: Cannot call method 'replace' of undefined - underscore.js
. 当我试图调用视图模板时,我收到错误
Uncaught TypeError: Cannot call method 'replace' of undefined - underscore.js
。 Please help me to find the mistake. 请帮我找错。
How can I convert str
string in Cart
class to a template
of underscore.js
. 如何将
Cart
类中的str
字符串转换为underscore.js
template
。
Any help would be much appreciated, thank you. 非常感谢任何帮助,谢谢。
I'd guess that your problem is where you're storing #cart_template
in the DOM: 我猜你的问题是你在DOM中存储
#cart_template
的地方:
<div id="cartlist">
<script type="text/template" id="cart_template">
</script>
</div>
You create your CartList
like this: 您可以像这样创建
CartList
:
var cart_view = new CartList({ el: $("#cartlist").html(myCart.showCart()) });
When you say this: 当你这样说:
$("#cartlist").html(myCart.showCart())
everything that was inside #cartlist
is gone, in particular, #cart_template
is gone. #cartlist
所有内容都消失了,特别是#cart_template
消失了。 Then inside CartList
, you try to do this: 然后在
CartList
,你尝试这样做:
_.template( $("#cart_template").html(), {} );
But there is no more #cart_template
at that point so $('#cart_template').html()
is undefined
and that's where your error comes from: _.template
will call replace
internally but you're giving it undefined
as the template instead of a string. 但是那时候没有
#cart_template
所以$('#cart_template').html()
是undefined
,这就是你的错误来自: _.template
将在内部调用replace
但是你将它undefined
为undefined
的模板而不是一串。
The solution is to move your #cart_template
outside #cartlist
. 该解决方案是将您的
#cart_template
外#cartlist
。
I'd also recommend that you not pass the el
to the view's constructor, your view should create its own el
and the caller should put that el
where it wants it in the DOM. 我也建议您不要通过
el
到视图的构造函数,您认为应该建立自己的el
,主叫方应把该el
它希望在DOM。 That way the view is wholly responsible for its element and you'll have fewer zombie and event problems. 这样,视图对其元素负全部责任,并且您将拥有更少的僵尸和事件问题。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.