如何從Ember入門套件中顯示簡單的REST數據？

Question

我下載了ember入門套件，並希望顯示一個簡單的REST API數據，以了解Ember的工作方式。

從視頻和教程中，我發現有一個model掛鈎可用於注入數據。

所以我做了以下事情：

App.Router = Ember.Router.extend({
  model: function ({
    return $.getJSON("https://api.foursquare.com/v2/users/self?oauth_token=TOKENHERE&v=20130723");
  }),
  root: Ember.Route.extend({
    index: Ember.Route.extend({
      route: '/'
    })
  })
})

並在我的index.html添加了以下內容

  <script type="text/x-handlebars" data-template-name="application">
      {{title}}
  </script>

但是，這沒有用。 當我轉到index.html看不到任何內容。 此外，在“檢查元素”的“網絡”選項卡下，我看不到對REST API發出任何網絡請求。

我究竟做錯了什么？ 另外，出於示例目的，我只想擁有一個將包含一些json數據的data.json json文件。 但是，我看到Ember缺乏讀取文件的支持，這就是為什么我要嘗試由foursquare提供的示例rest api。

有沒有辦法使用余燼讀取json文件？ 我只在沒有服務器的瀏覽器上運行它。

Answer 1

看起來應該可以。 這是一個使用其他API但使用相同結構的示例：

JavaScript的：

App = Ember.Application.create();

App.Router.map(function() {
  // put your routes here
});

App.IndexRoute = Ember.Route.extend({
  model: function() {
    return $.getJSON("https://api.github.com/repos/emberjs/ember.js/stats/contributors");
  }
});

范本：

  <script type="text/x-handlebars">
    <h2>Welcome to Ember.js</h2>

    {{outlet}}
  </script>

  <script type="text/x-handlebars" data-template-name="index">
  Ember.js repository contributors
    <ul>
    {{#each user in controller}}
      <li>{{user.author.login}}</li>
    {{/each}}
  </ul>
  </script>

JSBin示例