EmberJS가 나머지 API에서 데이터를 가져 오지 못하도록했습니다.

Question

내 앱에 ember를 통합하려고합니다. 나는 엠버와 레코드 목록을 보여주는 테이블을 대체하고 싶다. 테이블의 데이터를 반환하는 나머지 API가 있습니다. 그러나 아래 ember 코드는 나머지 API에서 데이터를 가져 오도록 요청하지 않습니다. 다음은

var App = Ember.Application.create({}); 

App.Router.map(function() { 

}); 

App.Store = DS.Store.extend({ 
    revision: 11, 
    adapter: DS.RESTAdapter.extend({ 
     url: '/myapp/stuff/list' 
    }) 
}); 

App.Response = DS.Model.extend({ 
    author: DS.attr("string"), 
    book: DS.attr("string") 
}); 

는 내 html 페이지에있는 것입니다 :

<script type="text/x-handlebars"> 
     <h1>whatever</h1> 

     {{#each model}} 
     <h1>{{author}}</h1> 
     {{/each}} 
    </script> 

그러나, 브라우저에서 내가 볼 수있는 유일한 것은 whatever입니다. API 결과를 볼 수 없으며 myapp/stuff/list에 대한 요청도 볼 수 없습니다.

내 API는 다음과 같습니다 : 몇 가지 일이 일어나고있다

{ 
    "meta": { 
    "code": 200 
    } 
    "response": { 
     "stuff": [{ 
     "id": 1, 
     "author": "someone", 
     "book": "some book" 
     }, 
     { 
     "id": 2, 
     "author": "some author", 
     "book": "anotherbook" 
     } 
     ] 
    } 
} 

Answer 1

확인을 클릭합니다. 첫째, 경로 정의가 없다는 것입니다. 즉, 모델 데이터를 검색하는 방법을 지정하는 곳입니다. 당신의 API를 호출하려고 시도 장소 엠버이와

App.ApplicationRoute = Ember.Route.extend({ 
    model: function(){ 
    return App.Response.find(); 
    } 
}); 

:이 경우처럼, 당신의 API를 호출하는 모델 후크를 사용하여 응용 프로그램의 경로를 지정할 수 있습니다. 그러나 요청은 당신이 기대하는 URL이 아닐 것입니다 : 대신 ember가 복수화 된 모델 이름을 어댑터의 기본 URL에 추가하기 때문에 /myapp/stuff/list/responses을 호출 할 것입니다.

마지막으로 API가 반환하면 json ember는 키 응답으로 해시를 반환했지만 서버에 매핑이 없습니다.. 관습에 따라 API는 단일 응답 대신 응답 배열을 반환해야합니다. 다음은 작동합니다

{ 
"meta": { 
"code": 200 
}, 
"responses": [ 
    { "id": 1, "author": "someone", "book": "some book "}, 
    { "id": 2, "author": "some author", "book": "anotherbook" } 
] 
} 

내가 http://jsbin.com/ICoYUxU/2/edit?html,js,output

App = Ember.Application.create({}); 

App.Router.map(function() {}); 

App.Response = DS.Model.extend({ 
    author: DS.attr("string"), 
    book: DS.attr("string") 
}); 

App.ApplicationRoute = Ember.Route.extend({ 
    model: function(){ 
     return App.Response.find(); 
    } 
}); 

App.Store = DS.Store.extend({ 
    adapter: 'App.Adapter' 
}); 

var responses = { 
    "meta": { 
    "code": 200 
    }, 
    "responses": [ 
    { "id": 1, "author": "someone", "book": "some book "}, 
    { "id": 2, "author": "some author", "book": "anotherbook" } 
    ] 
}; 

App.API = { 
    '/myapp/stuff/list/responses': responses 
}; 

App.Adapter = DS.RESTAdapter.extend({ 
    url: '/myapp/stuff/list', 
    ajax: function(url, type, hash) { 
    json = App.API[url]; 
    console.log('App.Adapter.ajax:', url, type, hash, json); 
    return new Ember.RSVP.Promise(function(resolve, reject) { 
     Ember.run(null, resolve, json); 
    }); 
    } 
});