だから、残りのAPIからデータを読み込もうとしているEmber.jsのシンプルなページがあります。
API は apiary.io によって提供され、次の単純なデータを返します
{"semantics": [
{key : "11111", name : "Block 1"},
{key : "22222", name : "Block 2"},
{key : "33333", name : "Block 3"},
{key : "44444", name : "Block 4"},
{key : "55555", name : "Block 5"}
]}
問題は、App.Semantic.find() でデータを取得するモデルであり、テンプレートに項目を配置していません。
しかし、ルートに配列値を設定すると、期待どおりに機能します
App.SemanticRoute = Ember.Route.extend({
model: function () {
//return App.Semantic.find();
return [{key:111,name:"aaaa"},{key:222,name:"qqqqq"},
{key:3333,name:"bbbb"},key:555,name:"ccc"}];
}
});
問題はどこだ?
API へのリンク - http://bug0r.apiary.io/api/semantics
コード付きの jsFiddle - jsfiddle
完全なコードはこちら
var App = window.App = Ember.Application.create({
VERSION: '1.0',
rootElement: '#appRoot',
LOG_TRANSITIONS: true
});
App.deferReadiness(); // do not initialize it until we are ready
App.Adapter = DS.RESTAdapter.extend({
namespace: 'api',
url: 'http://bug0r.apiary.io'
});
App.Adapter.map('Semantic', {
primaryKey: 'key'
});
App.Store = DS.Store.extend({
revision: 12,
adapter: App.Adapter
});
App.Router.map(function () {
// each call will create Ember.Route instance for customizing route
this.resource("semantic", {
path: "/"
});
this.route("about", {
path: "/about"
});
});
/* Symantic model*/
App.Semantic = DS.Model.extend({
key: DS.attr('string'),
name: DS.attr('string'),
});
App.SemanticRoute = Ember.Route.extend({
model: function () {
return App.Semantic.find();
}
});
App.advanceReadiness(); // ready for initialization
編集: 1. JSON API は修正されましたが、まだ機能しません。