Не удалось получить данные руля в шаблон

Я изучаю ember.js с помощью официальной документации и имею следующая html-страница, содержащая шаблон усов:

 <section id="main">
      <ul id="todo-list">
        {{#each controller}}
        <li {{bindAttr class="isCompleted:completed"}}>
          <input type="checkbox" class="toggle">
          <label>{{title}}</label><button class="destroy"></button>
        </li>
        {{/each}}
      </ul>

      <input type="checkbox" id="toggle-all">
    </section>

Однако проблема в том, что браузер отображает данные как:

{{#each controller}}
  {{title}}
{{/each}}

без рендеринга начальных данных, предоставленных в шаблон. У меня есть следующие объявления javascript непосредственно перед концом тега body:

  <script src="js/libs/jquery.js"></script>
  <script src="js/libs/handlebars.js"></script>
  <script src="js/libs/ember.js"></script>
  <script src="js/libs/ember-data.js"></script>

  <script src="js/libs/application.js"></script>
  <script src="js/libs/router.js"></script>
  <script src="js/models/store.js"></script>
  <script src="js/models/todo.js"></script>

Страница загружается без каких-либо ошибок, о которых сообщает firebug. Пожалуйста, дайте мне знать, что мне не хватает.


handlebars.js ember.js ember-data mustache
person Sumit Bisht    schedule 22.08.2013    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Я предполагаю, что вы упускаете что-то фундаментальное - тег скрипта handlebars вокруг вашего «шаблона», data-template-name должен быть назван в зависимости от маршрута, на котором вы находитесь, я использовал здесь application только для примера. В упомянутых вами официальных руководствах, если вы включите html-панель во встроенном jsbin, вы увидите, что я имею в виду, прямо под тегом body находится тег сценария обертки с именем todos.

<script type="text/x-handlebars" data-template-name="application">
 <section id="main">
  <ul id="todo-list">
    {{#each controller}}
    <li {{bindAttr class="isCompleted:completed"}}>
      <input type="checkbox" class="toggle">
      <label>{{title}}</label><button class="destroy"></button>
    </li>
    {{/each}}
  </ul>

  <input type="checkbox" id="toggle-all">
</section>
</script>

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

person intuitivepixel    schedule 22.08.2013
comment
большое спасибо, я следил за руководством пользователя по началу работы, и там не было такого упоминания о закрывающем теге скрипта. - person Sumit Bisht; 22.08.2013