标签: ember-data

将项添加到来自ember-data的过滤结果中

我有一个DS.Store使用DS.RESTAdapterChatMessage定义的对象:

App.ChatMessage = DS.Model.extend({
    contents: DS.attr('string'),
    roomId:   DS.attr('string')
});
Run Code Online (Sandbox Code Playgroud)

请注意,房间中存在聊天消息(为简单起见未显示),因此在我的聊天消息控制器(扩展Ember.ArrayController)中,我只想为用户当前所在的房间加载消息:

loadMessages: function(){ 
    var room_id = App.getPath("current_room.id");
    this.set("content", App.store.find(App.ChatMessage, {room_id: room_id}); 
}
Run Code Online (Sandbox Code Playgroud)

这将设置content为a DS.AdapterPopulatedModelArray并且我的视图愉快地显示{{#each}}块中所有返回的聊天消息.

现在谈到添加新消息,我在同一个控制器中有以下内容:

postMessage: function(contents) {
    var room_id = App.getPath("current_room.id");
    App.store.createRecord(App.ChatMessage, {
        contents: contents,
        room_id: room_id
    });

    App.store.commit();
}
Run Code Online (Sandbox Code Playgroud)

这会启动ajax请求以在服务器上保存消息,到目前为止一切都很好,但它不会更新视图.这非常有意义,因为它是一个过滤结果,如果我删除了room_id过滤器,App.store.find那么它会按预期更新.

尝试this.pushObject(message)使用返回的消息记录App.store.createRecord会引发错误.

如何手动将项目添加到结果中?似乎没有成为一个办法,据我可以告诉既DS.AdapterPopulatedModelArrayDS.FilteredModelArray是不可变的.

ember.js ember-data

8
推荐指数
2
解决办法
2609
查看次数

事务提交后设置回调

我正在尝试实现一些我认为有一个简单答案的东西,但不知何故我找不到它的源代码ember-data.

我想在将一组特定的修改提交到数据存储区后触发一个操作.这是我目前的代码:

var transaction = App.store.transaction();
user = App.get('currentUser');
transaction.add(user);
user.set('name', "Michael Jackson");
transaction.commit();
App.navigate('dashboard');
Run Code Online (Sandbox Code Playgroud)

我的第一次尝试是在这个用户的isDirty属性上添加一个观察者,但是a)它似乎不是惯用的,更重要的是b)我必须在最后手动删除那个观察者 - 如果某些异常在两者之间增加,则容易出错.例如,不会被删除.

有任何想法吗?你会怎么做?

ember.js ember-data

8
推荐指数
1
解决办法
3217
查看次数

通过sortProperty mixin对由Ember-Data支持的ArrayController进行排序

我希望能够对其ArrayController内容来自余烬数据查询进行排序.不幸的是,sortPropertymixin在这种情况下似乎不起作用.

我希望能够做到以下几点:

App = Ember.Application.create();
App.store = DS.Store.create({ revision: 4});

App.Item = DS.Model.extend({
    id: DS.attr('string'),
    name: DS.attr('string')
});

App.store.createRecord(App.Item, {id: '4', name: 'banana' });
App.store.createRecord(App.Item, {id: '2', name: 'apple'});
App.store.createRecord(App.Item, {id: '6', name: 'spaghetti'}); 

App.ItemsController = Ember.ArrayController.create({
    content: App.store.findAll(App.Item),
    sortProperties: ['name']
});
Run Code Online (Sandbox Code Playgroud)

使用最新版本的EmberEmber-data,这给出了输出:

[ id: 4, name: banana ]

[ id: 2, name: apple ]

[ id: 6, name: spaghetti ]
Run Code Online (Sandbox Code Playgroud)

这里的问题是App.store.findAll()返回一个RecordArray内容属性不仅仅是一个App.Item实例数组(在这种情况下,内容是[2,3,4])

为了实际掌握实例,我需要使用类似的东西objectAt().但即使我从中提取App.Item实例RecordArray …

ember.js ember-data

8
推荐指数
2
解决办法
7371
查看次数

Ember在遇到大型数据集时窒息

寻找大型数据集导致的问题的解决方案,迫使Ember在尝试处理数据时锁定浏览器.

对于分页,我使用tchak的方便分页mixin来分散从后端API加载的大约13,000个对象.

Ember Data对象包含ID,一个文本属性和多个数字属性.

问题是在浏览器完成数据处理之前需要将近一分钟,同时使浏览器无法使用.Firefox甚至会发出警告,指出脚本正在耗尽所有浏览器资源,并建议终止脚本.

我已经编写了自己的分页mixin,它按范围请求对象,即10-25项,除了一个严重的限制外,它通常运行良好:排序.为了对数据进行排序,我需要向后端发出额外的请求并重新加载对象,即使它们中的一些已被加载.

我希望能够预先加载所有内容以简化排序过程,而无需对后端API进行额外请求.我正在寻找如何解决这个问题的指导,但我愿意接受一种完全替代的方法.

如果没有别的,是否可以减少Ember在浏览器上放置的资源占用空间,因为它试图将所有13k对象加载到ArrayController中?


我正在使用Ember 1.0.0-pre2和最新的Ember数据(目前在修订版10中).

在后端是Rails 3.2.8.


更新我通过将数据加载到除Array之外的ArrayController属性来回避问题content.这使加载时间从一分钟以下缩短到仅几秒钟.然后我切片请求的项目数并将其加载到内容中.这适用于任何数量的项目,代价是无法轻松对数据进行排序.

ember.js ember-data

8
推荐指数
1
解决办法
1654
查看次数

如何在EmberData中回滚关系更改

我有两个有亲子关系的模型:训练和锻炼:

App.Training = DS.Model.extend({
  exercises: DS.hasMany('App.Exercise')
})

App.Exercise = DS.Model.extend({
  training: DS.belongsTo('App.Training')
})
Run Code Online (Sandbox Code Playgroud)

我希望有一个页面,其中显示了所有相关练习的训练.如果用户按下Edit按钮,则页面变得可编辑,可以添加新练习.我还想要一个Cancel放弃所有更改的按钮.

这是我的控制器:

App.TrainingsShowController = Em.ObjectController.extend({
  editing: false,

  edit: function() {
    this.set('editing', true);
    transaction = this.get('store').transaction();
    transaction.add(this.get('model'));
    this.get('model.exercises').forEach(function(x){
      transaction.add(x);
    });
  },

  cancel: function() {
    this.set('editing', false);
    this.get('model.transaction').rollback();
  },

  save: function() {
    this.set('editing', false);
    this.get('model.transaction').commit();
  },

  addExercise: function() {
    this.get('model.exercises').createRecord({});
  }
})
Run Code Online (Sandbox Code Playgroud)

控制器中有四个事件处理程序:

  1. edit:用户按下Edit按钮:创建事务,页面进入"编辑"模式.
  2. cancel:用户按下Cancel按钮:事务回滚并返回"正常"模式.
  3. save:用户按下Save按钮:提交事务并返回"正常"模式.
  4. addExercise:用户按下Add exercise按钮:创建新练习(在同一事务中)并添加到培训中.

除了新创建的记录之外,回滚功能正常工作:如果我按下Edit按钮,添加新练习并按下Cancel按钮,新创建的练习将保留在页面上. …

relationships ember.js ember-data

8
推荐指数
2
解决办法
4100
查看次数

Emberjs:如何一次过滤多个房产

下面我肯定会过滤一个属性,但是如何一次性过滤?也就是说,不向用户提供包含不同搜索选项的下拉列表 示例:我的搜索词可能是姓名,电子邮件或年龄.

var search = this.controllerFor('employees').search; //can be name, email or age

employees = this.get('currentModel').filterProperty('name', search);
Run Code Online (Sandbox Code Playgroud)

以上工作可以很好地更新主列表,但我只能一次过滤一个属性.

//Sample Model
App.Employee = DS.Model.extend({
    email: DS.attr('string'),
    name: DS.attr('string'),
    age: DS.attr('number'),
})
Run Code Online (Sandbox Code Playgroud)

一种想法是如果过滤器结果再次重新过滤,length = 0并且一些如何合并结果.但是,我对这个想法并不陌生,并且相信Ember可能会有更好的 - 更优雅的方式实现这一目标.

javascript ember.js ember-data

8
推荐指数
1
解决办法
3301
查看次数

迭代Ember.js余烬数据记录数组

我整天都在反对这个问题,我觉得我已接近解决方案,但却无法实现.我正在使用Ember.js和Ember-Data以及Fixtures适配器,最终迁移到REST适配器.基本问题是:我有网站和主管,有多对多的关系.我想向用户显示他们现有站点/主管配对的选择框,按站点排序,即:

  • 网站1 - 主管1
  • 网站1 - 主管2
  • 站点2 - 主管1 (记住,多对多)
  • 第2站 - 主管3

我需要将这两个资源争用到一个数组中,我可以将其传递给从Ember.Select继承(或将继承)的视图.目前我正在尝试使用Supervisors控制器上的一个方法,我称之为"平坦",因为它将返回一个表示这些关系的扁平数组.控制器如下所示.我正在使用.find().then()来处理承诺完成后的数据.我得到的数据似乎包含我的所有四个灯具,但是当我尝试它们的任何可枚举方法时(特别是forEach),它的行为就像它只返回了第一个对象一样.我试过迭代数据对象以及data.get('content').我对Ember很新,所以也许我不管怎么说这都是错的,但无论如何这对我来说似乎很奇怪.这是我的代码:

App.SupervisorsController = Ember.ArrayController.extend({
  flat: function(){
    return App.Supervisor.find().then(function(data){
      var c = data.get('content') ;
      console.log(c) ;    // <-- logs an object containing four records,
                          //     with attribute "length" showing 4
                          //     Great! (see below for log output)

      console.log(c[0]) ; // <-- logs first record. Great!
      console.log(c[1]) ; // <-- undefined (?!)
      console.log(c[2]) ; // <-- undefined (?!)
      console.log(c[3]) ; // <-- undefined (?!) …
Run Code Online (Sandbox Code Playgroud)

javascript ember.js ember-data

8
推荐指数
1
解决办法
2万
查看次数

如何将数组属性传递给Ember组件?

我的Ember组件看起来像这样:

import Ember from 'ember';

export default Ember.Component.extend({
  users: undefined,
  primaryAction: 'follow',
  leftSubDetails:  [],
  rightSubDetails:  [],

  onInitialization: function(){
    console.log('this', this);
    console.log('right',this.rightSubDetails);
    console.log('rightdetail', this.get('rightSubDetails'));
  }.on("init")
});
Run Code Online (Sandbox Code Playgroud)

并且组件被调用如下:

{{#view-users
  users=model
  primaryAction='follow'
  leftSubDetails=['tweets', 'followers', 'following']
  rightSubDetails=['follow', 'reply', 'addList']
}}
{{/view-users}}
Run Code Online (Sandbox Code Playgroud)

看起来什么也没有打印,也不能在视图中使用任何东西.有什么不对吗?

ember.js ember-data ember-cli

8
推荐指数
2
解决办法
6572
查看次数

this.get('model')和modelFor之间的区别

我是ember的新手,并没有真正区分两种语法.我应该在哪种情况下使用哪种情况.即哪一个更适合在路由中使用哪个更适合在控制器中使用.

this.get('model')
Run Code Online (Sandbox Code Playgroud)

相反

this.modelFor('artists/show')
Run Code Online (Sandbox Code Playgroud)

ember.js ember-data

8
推荐指数
2
解决办法
9139
查看次数

EmberJS在有效负载JSONAPI中嵌入了项目

Ember      : 1.13.3
Ember Data : 1.13.5
jQuery     : 1.11.3
Run Code Online (Sandbox Code Playgroud)

我正在尝试使用来自我的EmberJS客户端的ember-data向我的服务器发送JSON有效负载.我想在保存项目时将整个对象图发送到服务器,因为我不想发送多个请求.我不介意发送多个请求,但我担心如果其中一个请求在中间失败并且服务器上的数据不正确会发生什么.

我想使用JSONAPI(http://jsonapi.org/format/#document-compound-documents),因为它正在成为Ember中的默认适配器.此外,还有一些C#库可以处理这种格式,因此我认为它非常简单.但是,在阅读规范之后,如果没有id,我似乎无法嵌入对象.即使我{ async: false, embedded: 'always' })在DS.attr上指定,EmberJS也不会将子对象附加到JSON .

我的问题是:如果应用程序的使用方式是在客户端创建对象图,那么如何使用JSONAPI格式将整个对象图发送到服务器?我是否必须在客户端生成ID以满足JSONAPI标准?然后,一旦他们到达服务器,只需忽略它们,以便用ORM生成的id保存它们?

这是我的labelGroup模型:

import DS from 'ember-data';

export default DS.Model.extend({
  name: DS.attr('string'),
  labels: DS.hasMany('label-model', { async: false, embedded: 'always' })
});
Run Code Online (Sandbox Code Playgroud)

这是我的项目模型:

import DS from 'ember-data';

export default DS.Model.extend(DS.EmbeddedRecordsMixin, {
  name: DS.attr('string'),
  labelGroups: DS.hasMany('labelGroup', { async: false, embedded: 'always'})

});
Run Code Online (Sandbox Code Playgroud)

这是我在项目上执行save()后得到的POST:

{
  "data":{
    "attributes":{"name":"Project"},
    "relationships":{
      "label-groups":{
        "data":[
         {"type":"label-groups","id":null},
         {"type":"label-groups","id":null},
         {"type":"label-groups","id":null},
         {"type":"label-groups","id":null},
         {"type":"label-groups","id":null},
         {"type":"label-groups","id":null},
         {"type":"label-groups","id":null}
       ]
     }
   },
   "type":"label-projects"
  } …
Run Code Online (Sandbox Code Playgroud)

ember.js ember-data json-api

8
推荐指数
1
解决办法
810
查看次数