Question

所以我正在努力学习EmberJS，而且我正在努力学习这个。基本上，我有以下基本结构

模板：

<ul>
  {{#each model as |game|}}
    <li>{{game.title}} - {{game.console}}</li>
  {{/each}}
</ul>

路线档案

export default Ember.Route.extend({
    model() {
        return [
         {'title':'Super Mario Bros', 'console':'NES'},
         {'title':'Pac Man', 'console':'Arcade'},
         {'title':'Galaga', 'console':'Arcade'},
         {'title':'Frogger', 'console':'Arcade'},
         {'title':'Marvel vs. Capcom', 'console':'Arcade'},
         {'title':'The Legend of Zelda', 'console':'NES'},
         {'title':'CastleVania', 'console':'NES'},
         {'title':'Final Fantasy IV', 'console':'SNES'}];
    }
});

但是我不想像我这里那样硬编码，而是想使用GET调用从Apiary API链接中提取它。我该怎么做？

（蜂房https://private-9c66cc-managementconsole.apiary-mock.com/getactiveroms）

Answer 1

对于符合JSON的API，您可以执行以下操作：

export default Ember.Route.extend({
  model() {
    let url = 'https://private-9c66cc-managementconsole.apiary-mock.com/getactiveroms';
    return Ember.$.getJSON(url);
  },
});

但是，由于此API不响应有效的JSON，因此您需要将API作为文本获取并在将其解析为JSON之前操作响应。

export default Ember.Route.extend({
  model() {
    let url = 'https://private-9c66cc-managementconsole.apiary-mock.com/getactiveroms';
    return Ember.$.ajax({
      url: url,
      dataType: 'text',
    })
    .then((result) => { 
      result = result.replace(/[ \n]+/g, '');
      result = result.substring(1, result.length - 1);
      result = result.replace(/'/g, '"');
      return JSON.parse(result);
    }, (err) => {
      console.log('err', err); 
    });
  },
});

我建议更新API响应以包含有效的JSON，以便在使用时更轻松。

如何使用EmberJS从外部API中提取数据？

1 个答案: