Question

我刚刚开始使用裸机入门套件，尝试做一些非常基本的事情。

在我的最终结果应用中，会有一个类别和子类别列表作为应用的导航。我的解决方案是Ember新手，只是为了得到一些有用的东西，就是从Tom Dale的教程开始，然后尝试从那里开始。所以，我设置了一个变量来保存一些虚拟模型，用于在屏幕上显示某些内容。

当我尝试运行该应用时，收到错误Uncaught TypeError: Cannot set property 'dataSourceBinding' of undefined

EDIT-- 我已经尝试将categories变量的声明移到app.js文件的顶部，但仍然会得到相同的错误。

我的问题实际上是两个问题：

我错过了什么/做错了什么？
我意识到最终设置应用程序时，类别作为索引操作的模型可能不是最好的方法。此列表需要是动态的，因为它可由用户配置。是否有更好的方法将此动态导航包含在主模板中？

app.js：

MSSWApp = Ember.Application.create();

MSSWApp.Router.map(function() {
  this.resource('categories', function() {
    this.resource('category', { path: ':category_id' });
  });
});

MSSWApp.IndexRoute = Ember.Route.extend({
  model: function() {
    return categories;
  }
});

var categories = [{
  id: 1,
  title: "Auto & Mechanical"
}, {
  id: 2,
  title: "Beauty & Fashion"
}, {
  id: 3,
  title: "Careers & Education"
}];

index.html：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="initial-scale=1.0">
  <title>Test Ember Model on Index</title>
  <link rel="stylesheet" href="css/normalize.css">
  <link rel="stylesheet" href="css/style.css">
</head>
<body>
  <script type="text/x-handlebars">
    <h1>Categories</h1>
    <ul>
      {{#each in model}}
      <li>
        <h2>
          {{#link-to 'category' this}}
            {{title}}
          {{/link-to}}
        </h2>
        <ul>
          <li>
            <a href="#">Sub 1-1</a>
          </li>
          <li>
            <a href="#">Sub 1-2</a>
          </li>
          <li>
            <a href="#">Sub 1-3</a>
          </li>
        </ul>
      </li>
      {{/each}}
    </ul>
    {{outlet}}
  </script>

  <script src="js/libs/jquery-1.10.2.js"></script>
  <script src="js/libs/handlebars-1.1.2.js"></script>
  <script src="js/libs/ember-1.5.1.js"></script>
  <script src="js/app.js"></script>
  <!-- to activate the test runner, add the "?test" query string parameter -->
  <script src="tests/runner.js"></script>
</body>
</html>

Answer 1

原来模板需要一个名字，否则Ember会认为它是应用程序模板。

像这样设置脚本标记：

<script type="text/x-handlebars" data-template-name="index">

做了这个伎俩

灰烬投掷无法设置属性＆＃39; dataSourceBinding＆＃39;尝试在索引路径上使用模型时未定义

1 个答案: