javascript - 如何通过 #each 循环使用 Ember.Object 实例

Question

我正在组装我的第一个 Ember 应用程序，但数据方面遇到了一些问题。看来我的选择是:

• 来自 Ember Data(听起来像是 not ready for production 和 possibly broken)
• 通过 Ember.Object(在迭代这些对象时遇到问题)
• 通过一个普通的 JS 数组(我怀疑这太简单了)

我猜要使用 Ember.Object 实例:

// Attempt to modify the Blog Tutorial (http://emberjs.com/guides/) to use Ember.Object for data
App.Posts = Ember.Object.extend([
{
    id: '1',
    title: "Rails is Omakase",
    author: { name: "d2h" },
    date: new Date('12-27-2012'),
    body: "I want this for my ORM, I want that for my template language, and let's finish it off with this routing library. Of course, you're going to have to know what you want, and you'll rarely have your horizon expanded if you always order the same thing, but there it is. It's a very popular way of consuming software.\n\nRails is not that. Rails is omakase."
}, {
    id: '2',
    title: "The Parley Letter",
    author: { name: "d2h" },
    date: new Date('12-24-2012'),
    body: "A long list of topics were raised and I took a time to ramble at large about all of them at once. Apologies for not taking the time to be more succinct, but at least each topic has a header so you can skip stuff you don't care about.\n\n### Maintainability\n\nIt's simply not true to say that I don't care about maintainability. I still work on the oldest Rails app in the world."  
}
]);
posts = App.Posts.create();

但是我在循环这些数据时遇到了麻烦:

<!-- === POSTS === -->
<script type="text/x-handlebars" id="posts">
  <table class='table'>
    <thead>
      <tr><th>Recent Posts</th></tr>
    </thead>
    {{#each model}}
      <tr><td>
        {{#link-to 'post' this}}{{title}} <small class='muted'>by {{author.name}}</small>{{/link-to}}
      </td></tr>
    {{/each}}
  </table>

  {{outlet}}
</script>

我的检查器控制台显示:

Denying load of chrome-extension://ganlifbpkcplnldliibcbegplfmcfigp/scripts/vendor/jquery/jquery.min.map. Resources must be listed in the web_accessible_resources manifest key in order to be loaded by pages outside the extension. (index):1
DEBUG: -------------------------------                                ember-1.0.0-rc.8.js:382
DEBUG: Ember.VERSION : 1.0.0-rc.8                                     ember-1.0.0-rc.8.js:382
DEBUG: Handlebars.VERSION : 1.0.0                                     ember-1.0.0-rc.8.js:382
DEBUG: jQuery.VERSION : 1.9.1                                         ember-1.0.0-rc.8.js:382
DEBUG: -------------------------------                                ember-1.0.0-rc.8.js:382
Assertion failed: Expected hash or Mixin instance, got [object Array] ember-1.0.0-rc.8.js:382
Assertion failed: The value that #each loops over must be an Array. You passed <App.Posts:ember284>   ember-1.0.0-rc.8.js:382
Uncaught TypeError: Object [object Object] has no method 'addArrayObserver'     ember-1.0.0-rc.8.js:21860
Ember Debugger Active
Resource interpreted as Script but transferred with MIME type text/html: "http://www.superfish.com/ws/sf_main.jsp?dlsource=tduqbwo&userId=834F74FF-83A8-4EDB-BC8A-9433A559E216".

那么如何循环访问 Ember.Object 实例中的数据呢？

Answer 1

你所做的是错误的(我认为)。您创建了 App.Posts 的实例，该对象的内容是一个数组。可以说，您应该做的是创建 App.Post (单数)实例，并将它们放入数组中。您所做的事情是，App.Posts 实例是一个对象，您将其分配给 Controller 的内容，因此，它只是一个(不是数组)对象，并且在您尝试迭代的 View 中它，但它不是一个数组，如果你想迭代它，请尝试:

{{#each post in model.content}}
  <tr><td>
    {{#link-to 'post' this}}{{post.title}} <small class='muted'>by {{post.author.name}}</small>{{/link-to}}
  </td></tr>
{{/each}}

看看它是否有效。不过也试试我说的，效果更好。