如何使用ember.js通过rest适配器访问数据并将其传递给模板

how to use ember.js for accessing data through rest adapter and pass it to template

本文关键字：数据 js ember 何使用 通过 rest 访问 适配器      更新时间：2023-09-26

我最近开始学习ember.js，在rest适配器中遇到了一些问题。我的代码就像这个

   App = Ember.Application.create();
App.Router.map(function() {
  this.resource('about');
  this.resource('posts');
  });
App.Posts = DS.Model.extend({
  response: DS.attr('string')
});  

App.Store = DS.Store.extend({
  revision: 12,
  adapter: DS.RESTAdapter.create({
  namespace: '89/gz/connectweb/timeliner/js/data.json',
    host: 'http://local_env.mhhe.com'
  })
});
App.PostsRoute = Ember.Route.extend({
model: function (posts) {
  var jsondata =  this.store.find(posts);
    return jsondata;
  }

});
App.PostsView = Ember.View.extend({
  didInsertElement : function(){
   // this._super();
    var jsondata = $('#restdata').html();   
    var s_date = jsondata.split("</script>");
    var final_data = s_date[1].split("<script");    
    var jsonarray = JSON.parse(final_data[0]);
    console.log(jsonarray);
    timeLineData(jsonarray)
    // perform your jQuery logic here
  }
});

我按代码编辑过。在这种情况下，如果我通过执行inspect元素来检查url，我就可以成功地隐藏url并获取数据作为响应，但现在这些数据没有在路由中被访问。我只想至少知道这里出了什么问题。

Ember期望数据采用json特定格式
给定以下模型：

App.Post = DS.Model.extend({
  title:    DS.attr(),
  comments: DS.hasMany('comment'),
  user:     DS.belongsTo('user')
});
App.Comment = DS.Model.extend({
  body: DS.attr()
});

EmberData预计对/posts/1的GET请求将以以下格式返回JSON：

{
  "post": {
    "id": 1,
    "title": "Rails is omakase",
    "comments": ["1", "2"],
    "user" : "dhh"
  },
  "comments": [{
    "id": "1",
    "body": "Rails is unagi"
  }, {
    "id": "2",
    "body": "Omakase O_o"
  }]
}

如果你的数据不是这种格式，从代码的外观来看，它不是，那么你需要格式化它。你可以在这里找到如何做到这一点
或者，你可以像这篇博客文章一样，在没有ember数据的情况下使用ember。

我在这里看到的第一个问题是适配器配置。当您使用当前配置调用this.store.find('post');时，它将调用：

http://local_env.mhhe.com/89/gz/connectweb/timeliner/js/data.json/posts

看起来你没有一个遵循预期格式的restfull后端，所以你最好只使用jquery，而不是Ember Data:

App.PostsRoute = Ember.Route.extend({
  model: function() {
    return Ember.$.getJSON('/89/gz/connectweb/timeliner/js/data.json');
  }
});

第二，我不明白你在想做什么。从服务返回的数据已经在控制器中可用，您应该能够在模板上直接使用它

// views/posts.hbs
<ul>
  {{#each}}
    <li>{{title}}</li>
  {{/each}}
</ul>
相关文章：