Ответ 1
Вы запускаете Handlebars.compile() перед тем, как TEMplateScript загрузится в DOM. Переместите ваш test.js ниже шаблона script, и вам должно быть хорошо идти.
Я знаю, что его спрашивали много раз, я посмотрел ответы и не уверен, где я ошибаюсь.
Я просмотрел документы на Handlebarsjs и пошел за учебником, и оба раза я получаю ту же ошибку.
<!DOCTYPE html>
<html>
<head>
<script src="handlebars-v1.3.0.js"></script>
<script src="jquery.min.js"></script>
<script src="test.js"></script>
</head>
<body>
<script id="header" type="text/x-handlebars-template">
div {{ headerTitle }} div
Today is {{weekDay}}
</script>
</body>
</html>
И это мой Javascript
var theData = {headerTitle:"name", weekDay:"monday"}
var theTemplateScript = $("#header").html();
var theTemplate = Handlebars.compile(theTemplateScript);
$(document.body).append(theTemplate(theData));
Я продолжаю получать следующую ошибку, и я не уверен, почему
Uncaught Error: You must pass a string or Handlebars AST to Handlebars.compile.
You passed undefined
Вы запускаете Handlebars.compile() перед тем, как TEMplateScript загрузится в DOM. Переместите ваш test.js ниже шаблона script, и вам должно быть хорошо идти.
Перемещение сценариев в нижней части страницы также работало для меня.
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script id="header" type="text/x-handlebars-template">
div {{ headerTitle }} div
Today is {{weekDay}}
</script>
<script src="handlebars-v1.3.0.js"></script>
<script src="jquery.min.js"></script>
<script src="test.js"></script>
</body>
</html>
Как говорили другие, проблема заключается в том, что вы запускаете Handlebars.compile()
до того, как TemplateScript загрузится в DOM.
Поместив ваши javascript-вызовы в $(document).ready()
, вы убедитесь, что сначала загружен весь html.
var theData = {headerTitle:"name", weekDay:"monday"}
$(document).ready(function(){
var theData = {headerTitle:"name", weekDay:"monday"}
var theTemplateScript = $("#header").html();
var theTemplate = Handlebars.compile(theTemplateScript);
$(document.body).append(theTemplate(theData));
});
В файле JavaScript требуется немного модификации. Я была такая же проблема. В моем коде я назвал "handlebars" из Views (следующее объяснение относится к представлениям).
Включить следующие функции инициализации (init) в представлении:
theTemplate = Handlebars.compile(theTemplateScript);
В рендере записать оставшийся код:
var theTemplate = Handlebars.compile(theTemplateScript); $(Document.body).append(theTemplate (theData));
Правильный способ состоит в том, чтобы предварительно скомпилировать Обработчик, Хранить в файле, а затем назначить его theTemplate
.
В моем случае я получил ту же ошибку, но проблема была опечаткой в шаблоне script на странице html. У меня "prouct-template" должен был быть "шаблон продукта":
<script id="prouct-template" type="text/x-handlebars-template">
...
</script>
Как только я исправил опечатку, ошибка исчезла, и страница была загружена нормально.