Рули на вид не показывают данные

Я создал файл base.tpl в моем проекте PHP. И я хочу показать данные с помощью руля, но я получаю только пустую страницу. Не могли бы вы мне помочь ?
Мой код:

<html>
<head>
<title>HandleBar Features</title>
</head>
<body>
<script id="shoe-template" type="x-handlebars-template">
{{#people}}
<li class="shoes">
<p>{{name}}</p>
</li>
{{/people}}
</script>
<ul class="shoesNav">
</ul>

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="application/javascript" src="https://cdnjs.cloudflare.com   /ajax/libs/handlebars.js/4.0.5/handlebars.min.js"></script>
<script type="text/javascript">
$( document ).ready(function() {
var data = {
people: [
{name: "Alan"},
{name: "Allison"},
{name: "Ryan"}
],
empty: [ ]
};

var theTemplateScript = $('#shoe-template').html();
var theTemplate = Handlebars.compile(theTemplateScript);
$('.shoesNav').append(theTemplate(data));
});
</script>
</body>
</html>

Ошибка, что я получаю пустую страницу, и я не понимаю, где моя проблема. Спасибо заранее и извините за мой английский

1

Решение

У вас есть пустое место в вашем handlebar.js src src="https://cdnjs.cloudflare.com /ajax/libs/h, Пожалуйста, удалите его, и оно должно работать:

<html>
<head>
<title>HandleBar Features</title>
</head>
<body>
<script id="shoe-template" type="x-handlebars-template">
{{#people}}
<li class="shoes">
<p>{{name}}</p>
</li>
{{/people}}
</script>
<ul class="shoesNav">
</ul>

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="application/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.5/handlebars.min.js"></script>
<script type="text/javascript">
$( document ).ready(function() {
var data = {
people: [
{name: "Alan"},
{name: "Allison"},
{name: "Ryan"}
],
empty: [ ]
};

var theTemplateScript = $('#shoe-template').html();
var theTemplate = Handlebars.compile(theTemplateScript);
$('.shoesNav').append(theTemplate(data));
});
</script>
</body>
</html>
0

Другие решения

Официальный синтаксис для циклов foreach:

<script id="shoe-template" type="x-handlebars-template">
{{#each people}}
{{this.name}}
...

Надеюсь, это поможет!

0

По вопросам рекламы [email protected]