EmberデータJSONAPIAdapter：ネストされたリソースを取得します。

Question

Ember DataのJSONAPIAdapterがネストされたリソースで動作するようにしようとしています。サーバー部分については、django-rest-framework-json-apiが使用されます。

マイ（簡体字）燃えさしモデル：

case.js

export default Model.extend({ 
    firstName: attr('string'), 
    lastName: attr('string'), 
    comments: hasMany('comment'), 
}) 

comment.js

export default Model.extend({ 
    text: attr('string'), 
    case: belongsTo('case'), 
}) 

/api/v1/cases/4のためのサーバの応答は次のようになります。

{ 
    "data": [ 
    { 
     "type": "cases", 
     "id": "4", 
     "attributes": { 
     "first-name": "Hans", 
     "last-name": "Peter", 
     }, 
     "relationships": { 
     "comments": { 
      "meta": { 
      "count": 1 
      }, 
      "data": [ 
      { 
       "type": "comments", 
       "id": "5" 
      } 
      ], 
      "links": { 
      "related": "http://localhost:8000/api/v1/cases/4/comments" 
      } 
     } 
     } 
    } 
    ] 
} 

ここで、Ember DataとJSON-API仕様を正しく理解すると、コメントを参照するときにemberは/api/v1/cases/4/commentsを要求する必要があります。代わりに、/api/v1/comments/5を要求します。これは明らかに404を返します。

要約で私の質問：

• サーバーの応答はJSON-API仕様に準拠していますか？
• ネバーされたルートを尊重するにはどうすればよいですか？

私はember v2.8を使用しています。

ボーナスの質問：私は新しいコメントを作成するために同じ問題に直面しています - の代わりにPOSTから/case/4/commentsにemberを取得するにはどうすればよいですか？

Answer 1

JSON API仕様では、特定のURLパターンは適用されません。したがって、何をしようとしているのかはコンプライアンスです。しかし、Ember Dataでは、フラットなURL構造で作業する方が簡単ですが、回避策があります。

ember-data-url-templatesアドオンを見て、そのモデルのアダプタにロジックを追加します。ここでそのアドオンで

は、あなたがapp/adapters/comment.jsで何ができるかです：

import ApplicationAdapter from './application'; 
import UrlTemplates from 'ember-data-url-templates'; 

export default ApplicationAdapter.extend(UrlTemplates, { 
    namespace: 'api/v1', // You may or may not need this namespace setting: 
         // I'm a little rusty in this area :) 

    urlTemplate: '{+host}/case/{caseId}/comments{/id}', 

    urlSegments: { 
    contentId: function(type, id, snapshot/*, query */) { 
     return snapshot.belongsTo('case', { id: true }); 
    } 
    } 
}); 

アドオンがこの問題を回避することを可能にすることを何か他のものがない限り、私は、これは、その後のためにそのURL構造にあなたをロックすることを信じていますアプリ全体のコメントしたがって、このルートを下ることを決定する前に、そのトレードオフを間違いなく考慮する必要があります。

Answer 2

はい、これは

モデル/ client.js

export default DS.Model.extend({ 
    name: DS.attr('string'), 
    telno: DS.attr('string'), 

    campaigns: hasMany() 
}); 

モデル/ client.js

export default DS.Model.extend({ 
    name: DS.attr('string'), 
    startdate: DS.attr('date'), 
    enddate: DS.attr('date'), 

    client: DS.belongsTo('client') 
}); 

/テンプレート/クライアント/編集を次のように設定する必要があります動作します。BHS

<table class="table table-bordered table-striped table-condensed"> 
 
     <thead> 
 
      <tr> 
 
       <th></th> 
 
       <th>Name</th> 
 
      </tr> 
 
     </thead> 
 
     <tbody> 
 
      {{#each model.campaigns as |campaign|}} 
 
       <tr> 
 
        <td>{{campaign.name}}</td> 
 
       </tr> 
 
      {{/each}} 
 
     </tbody> 
 
    </table>

http://localhost:3000/api/clients/1

{ 
{ 
    "links": { 
    "self": "http://localhost:3000/api/clients/1" 
    }, 
    "data": { 
    "type": "clients", 
    "relationships": { 
     "campaigns": { 
     "links": { 
      "related": "http://localhost:3000/api/clients/1/campaigns" 
     } 
     } 
    }, 
    "id": "1", 
    "attributes": { 
     "name": "Test", 
     "telno": "123" 
    }, 
    "links": { 
     "self": "http://localhost:3000/api/clients/1" 
    } 
    } 
} 

http://localhost:3000/api/clients/1/campaigns

{ 
    "links": { 
    "self": "http://localhost:3000/api/clients/1/campaigns" 
    }, 
    "data": [ 
    { 
     "type": "campaigns", 
     "relationships": { 
     "client": { 
      "links": { 
      "related": "http://localhost:3000/api/campaigns/1/client" 
      } 
     } 
     }, 
     "id": "1", 
     "attributes": { 
     "enddate": "2019-01-01T00:00:00.000Z", 
     "name": "test", 
     "startdate": null 
     }, 
     "links": { 
     "self": "http://localhost:3000/api/campaigns/1" 
     } 
    } 
    ] 
}