Ember.js EmberJS解析RESTful api中的数据

我是新来恩伯的，我每天都在学习。作为一项挑战，我很难从RESTful API pokeapi.co获取数据 我想获得结果的名称和url 然后将ID作为参数传递，并获取/2/3等中的所有数据

我卡住了，请帮帮我。。。。 我的代码：

适配器/pokemon.js

model/pokemon.js

routes/pokemon.js

序列化程序/pokemon.js

模板/pokemon.hbs

我遵循治安官发布的命令，重新编写了所有代码。 现在它开始工作了：）

//app/adapters/monster.js

//app/models/monster.js

//app/routes/monster/monster-detail.js

//app/serializers/monster.js

{{！--app/templates/monsters/monster-list.hbs-->

/pokemon列表

{{{每个模型都是{怪物}

#：{{monster.number}}口袋妖怪：{{{monster.name}}-

{{/每个}}

您可以添加哪些部分正在“工作”以及在此过程中发生了哪些特定的事情吗？另一个问题。。。Ember会知道“口袋妖怪”的复数和单数吗你可能想把东西做成“怪物”或“怪物”之类的东西。

findRecord

要求传递id。请参阅末尾添加的控制台日志和错误。途中是芬德尔。。。对不起，我弄错了我试过。。。但我现在必须工作。：）也许这会有所帮助：那么，显示怪物的常规URL与应用程序中指向帮助者的ember链接背后的故事是什么呢。。。我会（尝试）在怪物细节、怪物移动等方面展示每个蒙特人的统计数据、移动等。谢谢你的屏幕演示。如果你查看，你会看到更多关于口袋妖怪的数据。

import DS from 'ember-data';

export default DS.RESTAdapter.extend({
    host:'https://pokeapi.co',
    namespace: 'api/v2',

    pathForType(){
        return 'pokemon';
    }
});

import DS from 'ember-data';

export default DS.Model.extend({
    name: DS.attr('string'),
    url: DS.attr('string')
});

import Route from '@ember/routing/route';

export default Route.extend({
    model(){
        return this.store.findAll('pokemon')
//    setupController(controller, model){
//    controller.set('pokemons',model);
    }
});

import DS from 'ember-data';

export default DS.RESTSerializer.extend({

    normalizeResponse(store, primaryModelClass, payload, id, requestType){
        payload = {
            pokemon: payload
        },
        console.log(payload);
        return this._super(store, primaryModelClass, payload, id, requestType);
   }
});

{{#each model as |pokemon|}}
      <div class="md-list-item-text">
         <h3>#{{pokemon.id}}: {{pokemon.name}}</h3>
        </div>
{{/each}}

{…}
pokemon: {…}
count: 949
next: "https://pokeapi.co/api/v2/pokemon/?limit=20&offset=20"
previous: null
results: […]
0: {…}
name: "bulbasaur"
url: "https://pokeapi.co/api/v2/pokemon/1/"
__proto__: Object { … }
1: {…}
name: "ivysaur"
url: "https://pokeapi.co/api/v2/pokemon/2/"
__proto__: Object { … }
2: {…}
name: "venusaur"
url: "https://pokeapi.co/api/v2/pokemon/3/"
__proto__: Object { … }
3: {…}
name: "charmander"
url: "https://pokeapi.co/api/v2/pokemon/4/"
__proto__: Object { … }
4: {…}
name: "charmeleon"
url: "https://pokeapi.co/api/v2/pokemon/5/"
__proto__: Object { … }
5: {…}
name: "charizard"
url: "https://pokeapi.co/api/v2/pokemon/6/"
__proto__: Object { … }
6: {…}
name: "squirtle"
url: "https://pokeapi.co/api/v2/pokemon/7/"
__proto__: Object { … }
7: {…}
name: "wartortle"
url: "https://pokeapi.co/api/v2/pokemon/8/"
__proto__: Object { … }
8: {…}
name: "blastoise"
url: "https://pokeapi.co/api/v2/pokemon/9/"
__proto__: Object { … }
9: {…}
name: "caterpie"
url: "https://pokeapi.co/api/v2/pokemon/10/"
__proto__: Object { … }
10: {…}
name: "metapod"
url: "https://pokeapi.co/api/v2/pokemon/11/"
__proto__: Object { … }
11: {…}
name: "butterfree"
url: "https://pokeapi.co/api/v2/pokemon/12/"
__proto__: Object { … }
12: {…}
name: "weedle"
url: "https://pokeapi.co/api/v2/pokemon/13/"
__proto__: Object { … }
13: {…}
name: "kakuna"
url: "https://pokeapi.co/api/v2/pokemon/14/"
__proto__: Object { … }
14: {…}
name: "beedrill"
url: "https://pokeapi.co/api/v2/pokemon/15/"
__proto__: Object { … }
15: {…}
name: "pidgey"
url: "https://pokeapi.co/api/v2/pokemon/16/"
__proto__: Object { … }
16: {…}
name: "pidgeotto"
url: "https://pokeapi.co/api/v2/pokemon/17/"
__proto__: Object { … }
17: {…}
name: "pidgeot"
url: "https://pokeapi.co/api/v2/pokemon/18/"
__proto__: Object { … }
18: {…}
name: "rattata"
url: "https://pokeapi.co/api/v2/pokemon/19/"
__proto__: Object { … }
19: {…}
name: "raticate"
url: "https://pokeapi.co/api/v2/pokemon/20/"
__proto__: Object { … }
length: 20
Error while processing route: pokemon Assertion Failed: You must include an 'id' for pokemon in an object passed to 'push'

import DS from 'ember-data';

export default DS.RESTAdapter.extend({
  host:'https://pokeapi.co',
  namespace: 'api/v2',

  pathForType() {
    return 'pokemon';
  },
});

import DS from 'ember-data';
import { computed } from '@ember/object';

export default DS.Model.extend({
  number: computed('url', function() {
    var fullUrl = this.get('url');
    return fullUrl.split('/')[6];
  }),
  name: DS.attr(),
  url: DS.attr(),
});

import Route from '@ember/routing/route';

export default Route.extend({
  model(params) { 
    var monster = this.store.findRecord('monster', params.number);
    console.info('incomming monster', monster);
    return monster;
  }
});

import DS from 'ember-data';

export default DS.RESTSerializer.extend({
  primaryKey: 'url', 

  normalizeResponse(store, primaryModelClass, payload, id, requestType) {
    payload = {
      monster: payload.results,
    }
    console.log(payload);
    return this._super(store, primaryModelClass, payload, id, requestType);
  }
});

<h2>/pokemon-list</h2>

<ul class='monster-list'>
  {{#each model as |monster|}}
    <li>
      #:{{monster.number}} Pokemon:{{monster.name}} - 
     </li>
  {{/each}}
</ul>