Question

我正忙着完成入门指南

目前正处于此时

http://emberjs.com/guides/getting-started/displaying-model-data/

我有一个把手模板

        <script type="text/x-handlebars" data-template-name="todos">
        <section id="todoapp">
          <header id="header">
            <h1>todos</h1>
            <input type="text" id="new-todo" placeholder="What needs to be done?" />
          </header>

          <section id="main">
            <ul id="todo-list">
              <li class="completed">
                <input type="checkbox" class="toggle">
                <label>Learn Ember.js</label><button class="destroy"></button>
              </li>
              <li>
                <input type="checkbox" class="toggle">
                <label>...</label><button class="destroy"></button>
              </li>
              <li>
                <input type="checkbox" class="toggle">
                <label>Profit!</label><button class="destroy"></button>
              </li>
            </ul>

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

          <footer id="footer">
            <span id="todo-count">
              <strong>2</strong> todos left
            </span>
            <ul id="filters">
              <li>
                <a href="all" class="selected">All</a>
              </li>
              <li>
                <a href="active">Active</a>
              </li>
              <li>
                <a href="completed">Completed</a>
              </li>
            </ul>

            <button id="clear-completed">
              Clear completed (1)
            </button>
          </footer>
        </section>

        <footer id="info">
          <p>Double-click to edit a todo</p>
        </footer>
    </script>

但是当我用

替换这个静态html时

     <script type="text/x-handlebars" data-template-name="todos">
        <section id="todoapp">
          <header id="header">
            <h1>todos</h1>
            <input type="text" id="new-todo" placeholder="What needs to be done?" />
          </header>

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

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

          <footer id="footer">
            <span id="todo-count">
              <strong>2</strong> todos left
            </span>
            <ul id="filters">
              <li>
                <a href="all" class="selected">All</a>
              </li>
              <li>
                <a href="active">Active</a>
              </li>
              <li>
                <a href="completed">Completed</a>
              </li>
            </ul>

            <button id="clear-completed">
              Clear completed (1)
            </button>
          </footer>
        </section>

        <footer id="info">
          <p>Double-click to edit a todo</p>
        </footer>
    </script>

ember应用程序无法加载。 ember检查员说没有申请。并且控制台中不显示任何错误。当我恢复到它修复的静态代码

JS代码

var Todos = Ember.Application.create();

Todos.ApplicationAdapter = DS.FixtureAdapter.extend();

Todos.Router.map(function () {
    this.resource('todos', { path: '/' });
});

Todos.TodosRoute = Ember.Route.extend({
    model: function () {
        return this.store.find('todo');
    }
});

Todos.Todo = DS.Model.extend({
    title: DS.attr('string'),
    isCompleted: DS.attr('boolean')
});

Todos.Todo.FIXTURES = [
 {
     id: 1,
     title: 'Learn Ember.js',
     isCompleted: true
 },
 {
     id: 2,
     title: '...',
     isCompleted: false
 },
 {
     id: 3,
     title: 'Profit!',
     isCompleted: false
 }
];

脚本代码

<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript" src="http://builds.emberjs.com.s3.amazonaws.com/handlebars-1.0.0-rc.3.js"></script>
<script type="text/javascript" src="http://builds.emberjs.com.s3.amazonaws.com/ember-latest.js"></script>
<script type="text/javascript" src="http://builds.emberjs.com.s3.amazonaws.com/ember-data-latest.js"></script>

Answer 1

将您的依赖项更新为：

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://builds.emberjs.com/handlebars-1.0.0.js"></script>
<script src="http://builds.emberjs.com/release/ember.js"></script>
<script src="http://builds.emberjs.com/beta/ember-data.js"></script>

一切都应该有效。

在这里，我已将您的代码粘贴到jsbin中并正确加载：http://jsbin.com/EdUnOKi/2/edit

希望它有所帮助。

添加车把标签到模板中断ember应用程序

1 个答案: