_.template() 时下划线分钟未捕获语法错误
Uncaught SyntaxError in underscore-min when _.template()
我正在尝试使用 backbone.js 显示带有某些模板的配置文件。情况是我对一种观点有疑问。所以,我有一个 View:ProfileView 和一个 Model:User.
错误(位于下划线-min.js:5)是:未捕获的语法错误:块范围声明(let、const、函数、class)在严格模式之外尚不支持
那我做的是:
router.js:
...
profile:function(){
console.log("profile");
this.user = new User();
this.profileView = new ProfileView({
model: this.user
});
...
User.js:
...
initialize: function(){
//var that = this;
this.fetch({
success: function(){
console.log("fetch success");
}
});
this.on("change", function(){
console.log("change on model");
});
},
...
ProfileView.js:
...
initialize: function(){
_.bindAll(this, "render");
this.model.bind('change', this.render);
},
render:function(){
console.log("render Profile");
var tmp = _.template($('#profile-template').html()); //ERROR
$(this.el).html(tmp(this.model.toJSON()));
return this;
}
...
profile.blade.php:
...
<script type="text/template" id="profile-template">
<div class="col-md-3 widget" id="widget">
<!-- Widget -->
<div class="widget widget-shadow text-center">
<div class="widget-header">
<div class="widget-header-content">
<a class="avatar avatar-lg" href="javascript:void(0)">
<img src="../public/assets/prof.jpg" alt="...">
</a>
<h4 class="profile-user"><%= name %></h4>
<p class="profile-type"><%= type %>, <%= class %></p>
<p>
<i class="icon icon-color wb-home" aria-hidden="true"></i><a href="#"> <%= website %></a>
</p>
<p>
<i class="icon icon-color wb-envelope" aria-hidden="true"></i> <%= email %>
</p>
</div>
</div>
</div>
</div>
<div class="col-md-9" id="profile">
<!-- Panel -->
<div class="panel">
<div class="panel-body nav-tabs-animate">
<div class="tab-content">
<div class="row">
<div class="col-md-6">
<h3 class="panel-title">about</h3>
<p><%= about %></p>
</div>
</div>
<div class="row">
<p></p>
</div>
<div class="row">
<div class="col-md-3">
<h4 class="example-title">contact</h4>
<p><%= contact %></p>
</div>
<div class="col-md-3">
<h4 class="example-title">capacity</h4>
<p><%= capacity %></p>
</div>
</div>
</div>
</div>
</div>
</div>
</script>
更新
我在提取完成时打印了它,它是在渲染之后。所以我修改了代码,在ProfileView.initialize中调用了this.model.fetch。
initialize: function(){
var that = this;
this.model.fetch().done(function(){
console.log("fetch done");
that.render();
});
现在提取是在渲染函数之前完成的……但仍然是同样的错误。
然后,如果我将模型添加为参数:
var tmp = _.template($('#profile-template').html(), this.model);
没有错误,但视图未显示任何内容且模型具有正确的数据。
class
是保留字,不能作为变量名使用,也不能作为模板中的变量使用。您必须将其重命名为其他名称,模板才能正常工作。
我正在尝试使用 backbone.js 显示带有某些模板的配置文件。情况是我对一种观点有疑问。所以,我有一个 View:ProfileView 和一个 Model:User.
错误(位于下划线-min.js:5)是:未捕获的语法错误:块范围声明(let、const、函数、class)在严格模式之外尚不支持
那我做的是:
router.js:
...
profile:function(){
console.log("profile");
this.user = new User();
this.profileView = new ProfileView({
model: this.user
});
...
User.js:
...
initialize: function(){
//var that = this;
this.fetch({
success: function(){
console.log("fetch success");
}
});
this.on("change", function(){
console.log("change on model");
});
},
...
ProfileView.js:
...
initialize: function(){
_.bindAll(this, "render");
this.model.bind('change', this.render);
},
render:function(){
console.log("render Profile");
var tmp = _.template($('#profile-template').html()); //ERROR
$(this.el).html(tmp(this.model.toJSON()));
return this;
}
...
profile.blade.php:
...
<script type="text/template" id="profile-template">
<div class="col-md-3 widget" id="widget">
<!-- Widget -->
<div class="widget widget-shadow text-center">
<div class="widget-header">
<div class="widget-header-content">
<a class="avatar avatar-lg" href="javascript:void(0)">
<img src="../public/assets/prof.jpg" alt="...">
</a>
<h4 class="profile-user"><%= name %></h4>
<p class="profile-type"><%= type %>, <%= class %></p>
<p>
<i class="icon icon-color wb-home" aria-hidden="true"></i><a href="#"> <%= website %></a>
</p>
<p>
<i class="icon icon-color wb-envelope" aria-hidden="true"></i> <%= email %>
</p>
</div>
</div>
</div>
</div>
<div class="col-md-9" id="profile">
<!-- Panel -->
<div class="panel">
<div class="panel-body nav-tabs-animate">
<div class="tab-content">
<div class="row">
<div class="col-md-6">
<h3 class="panel-title">about</h3>
<p><%= about %></p>
</div>
</div>
<div class="row">
<p></p>
</div>
<div class="row">
<div class="col-md-3">
<h4 class="example-title">contact</h4>
<p><%= contact %></p>
</div>
<div class="col-md-3">
<h4 class="example-title">capacity</h4>
<p><%= capacity %></p>
</div>
</div>
</div>
</div>
</div>
</div>
</script>
更新
我在提取完成时打印了它,它是在渲染之后。所以我修改了代码,在ProfileView.initialize中调用了this.model.fetch。
initialize: function(){
var that = this;
this.model.fetch().done(function(){
console.log("fetch done");
that.render();
});
现在提取是在渲染函数之前完成的……但仍然是同样的错误。 然后,如果我将模型添加为参数:
var tmp = _.template($('#profile-template').html(), this.model);
没有错误,但视图未显示任何内容且模型具有正确的数据。
class
是保留字,不能作为变量名使用,也不能作为模板中的变量使用。您必须将其重命名为其他名称,模板才能正常工作。