我很抱歉，但是，我找不到解决问题的答案。我是把手的noobie，并且无法从论坛中找出如何解决以下错误消息。我试图将一个编辑功能添加到从视频教程中获取的html5移动应用的列表中。车把似乎想要一根绳子，但我不确定我应该把这根绳子传递到哪里。我一直得到的错误是：未捕获错误：您必须将字符串或Handlebars AST传递给Handlebars.compile。您通过了undefined。我觉得renderTemplate函数不正确，因为我错过了parens和井号。但是，当我尝试添加parens和#tag targetTemplate时，我继续得到Uncaught错误。有人可以澄清它是否是parens /＃或我失踪的一些额外步骤。任何帮助将不胜感激。我没有提供完整的HTML，但是如果你需要它我会得到更好的理解。
<script id='full-list-template' type="text/x-handlebars-template">
<div class="list-group">
{{#each beers}}
<a data-item={{id}} data-target="#item-detail" href="#" class="list-group-item view-switcher">{{title}}</a>
{{/each}}
</div>
</script>
<script id="item-detail-template" type="text/x-handlebars-template">
<h3>Add Item</h3>
<div class="list-group">
<p id="show-title" class="list-group-item">{{title}}</p>
<p id="show-description" class="list-group-item">{{description}}</p>
<p id="show-image" class="list-group-item">
<span class="label">Image</span>
<img src="">
</p>
<p id="show-location" class="list-group-item">Current Location: Lat {{location.latitude}}, Long {{location.longitude}}</p>
</div>
<p>
<button data-target="#full-list" id="back-to-list" class="btn btn-lg-default view-switcher">Back to List</button>
<button data-item={{id}} data-target="edit-item" id="edit-item" class="btn btn-lg-default pull-right view-switcher">Edit</button>
</p>
</script>
<script id="add-item-template" type="text/x-handlebars-template">
<h3>Add Item</h3>
<form id="add-form" role="form" >
<div class="form-group">
<label for="title">Title</label>
<input class="form-control" id="title" name="title" type="text">
</div>
<div class="form-group">
<label for="title">Description</label>
<textarea class="form-control" id="description" name="description"></textarea>
</div>
<div class="form-group clearfix">
<button id="transcribe" class="btn btn-lg btn-info pull-right">Transcribe</button>
</div>
<div class="form-group clearfix">
<button id="upload-photo" class="btn btn-lg btn-success pull-right">Upload A Photo</button>
</div>
<div class="form-group">
<p><strong>Current Location: Lat 37, Long 122</strong></p>
</div>
<div class="form-group">
<button data-target="#full-list" id="cancel-add-item" class="btn btn-lg btn-default pull-left view-switcher">Cancel</button>
<button id="submit-add-item" class="btn btn-lg btn-primary pull-right">Submit</button>
</div>
</form>
</script>
<script id="edit-item-template" type="text/x-handlebars-template">
<h3>Edit Item</h3>
<form id="edit-form" role="form">
<input type="hidden" name="id" value="{{id}}" />
<div class="form-group">
<label for="title">Title</label>
<input class="form-control" id="title" name="title" type="text" value={{title}}>
</div>
<div class="form-group">
<label for="title">Description</label>
<textarea class="form-control" id="description" name="description">{{description}}</textarea>
</div>
<div class="form-group clearfix">
<button id="transcribe" class="btn btn-lg btn-info pull-right">Transcribe</button>
</div>
<div class="form-group clearfix">
<button id="upload-photo" class="btn btn-lg btn-success pull-right">Upload A Photo</button>
</div>
<div class="form-group">
<p><strong>Current Location: Lat 37, Long 122</strong></p>
</div>
<div class="form-group">
<button data-target="#full-list" id="cancel-add-item" class="btn btn-lg btn-default pull-left view-switcher">Cancel</button>
<button data-target="#full-list" id="edit-item" class="btn btn-lg btn-primary pull-right">Submit</button>
</div>
</form>
</script>
这是MAIN.JS档案：
＆＃39;使用严格的＆＃39 ;; 变种啤酒;
//functions
var hideShowFunction = function(evt){
var eventTarget = $(evt.target);
var data = eventTarget.data();
$('.view').removeClass('active');
$(data.target).addClass('active');
renderTemplate(data.target, data.item);
};
var renderTemplate = function(target, itemId) {
var targetTemplate = target + '-template';
var source = $(targetTemplate).html();
var template = Handlebars.compile(source);
// var data = {beers: beers};
// var data = {title: 'This is the title', body: 'This is the body!'};
// actual data!
var data;
if (itemId){
var arr = $.grep(beers, function(beer, i){
return beer.id == itemId;
});
data = arr[0];
}
else {
data = {beers: beers};
}
var html = template(data);
$(target).html(html);
};
$.fn.serializeObject = function(){
var o = {};
var a = this.serializeArray();
$.each(a, function() {
if (o[this.name] !== undefined) {
if (!o[this.name].push) {
o[this.name] = [o[this.name]];
}
o[this.name].push(this.value || '');
} else {
o[this.name] = this.value || '';
}
});
return o;
};
var saveEntry = function(result) {
var highestId = Math.max.apply(Math, beers.map(function(o){return o.id;}));
result.id = highestId > 0 ? highestId + 1 : 1;
beers.push(result);
localStorage.beers = JSON.stringify(beers);
};
var editEntry = function(result) {
var resultInt = parseInt(result.id);
result.id = resultInt;
for(i in beers) {
if (beers[i].id === resultInt ) {
beers[i] = result;
localStorage.beers = JSON.stringify(beers);
break;
}
}
};
// event listeners
$('body').on('click', '.view-switcher', function(evt){
hideShowFunction(evt);
});
$('body').on('submit','#add-form', function(evt){
var result = $(this).serializeObject();
saveEntry(result);
renderTemplate('#full-list');
return false;
});
$('body').on('submit','#edit-form', function(evt){
var result = $(this).serializeObject();
editEntry(result);
renderTemplate('#full-list');
return false;
});
//storage
if (Modernizr.localstorage) {
if (localStorage.beers){
beers = JSON.parse(localStorage.beers);
}
else {
beers = [];
}
}
else {
console.log('does not work');
}
// call render template (init)
renderTemplate('#full-list');
答案 0 :(得分：0)
在item-detail-template中，提交按钮缺少数据目标中的＃符号
<button data-item={{id}} data-target="#edit-item" id="edit-item" class="btn btn-lg-default pull-right view-switcher">Edit</button>
我刚刚开始做同样的视频教程，并且卡在同一个地方。我的问题是我无法获得localStorage来保存我的编辑。我注册了为此创建了一个问题。在我做自己的问题之前找到了你的问题。我希望这有助于回答即使是你发布后的一年：）