Javascript 如何在ember数据模型中表示数组？

当模型包含数组时，是否有必要使用指向

DS.Model

的

DS.hasMany

？即使数组元素不是真正的模型（没有自己的ID或端点）？有更好的办法吗

我使用的是

DS.hasMany

，但是我的扩展

DS.RESTAdapter

给我抛出了一个404试图访问模型，尽管我从未在模型上调用

find

，并且

hasMany

是用

{embedded:true}

调用的。我第一次看到这个错误（显然与这个模型有关，因为它没有它就消失了）：

这意味着什么？是什么导致了它

以下是堆栈跟踪：

Ember.assert ember-latest.js:43
Ember.View.states.inBuffer.empty ember-latest.js:13644
Ember.View.Ember.Object.extend.invokeForState ember-latest.js:12257
Ember.CollectionView.Ember.ContainerView.extend.arrayWillChange ember-latest.js:14477
invokeAction ember-latest.js:3193
iterateSet ember-latest.js:3175
sendEvent ember-latest.js:3323
Ember.Array.Ember.Mixin.create.arrayContentWillChange ember-latest.js:6963
Ember.ArrayProxy.Ember.Object.extend.arrangedContentArrayWillChange ember-latest.js:9281
Ember.ArrayProxy.Ember.Object.extend._arrangedContentWillChange ember-latest.js:9235
invokeAction ember-latest.js:3193
iterateSet ember-latest.js:3175
sendEvent ember-latest.js:3323
notifyObservers ember-latest.js:1872
Ember.notifyBeforeObservers ember-latest.js:2016
propertyWillChange ember-latest.js:2594
iterDeps ember-latest.js:2077
dependentKeysWillChange ember-latest.js:2092
propertyWillChange ember-latest.js:2592
set ember-latest.js:1416
DS.Model.Ember.Object.extend.dataDidChange ember-data-latest.js:3145
Map.forEach ember-latest.js:1273
OrderedSet.forEach ember-latest.js:1145
Map.forEach ember-latest.js:1271
DS.Model.Ember.Object.extend.dataDidChange ember-data-latest.js:3128
invokeAction ember-latest.js:3193
iterateSet ember-latest.js:3175
sendEvent ember-latest.js:3323
notifyObservers ember-latest.js:1872
Ember.notifyObservers ember-latest.js:1999
propertyDidChange ember-latest.js:2632
Ember.Observable.Ember.Mixin.create.propertyDidChange ember-latest.js:7917
Ember.Observable.Ember.Mixin.create.notifyPropertyChange ember-latest.js:7930
didChangeData ember-data-latest.js:2053
Ember.StateManager.Ember.State.extend.sendRecursively ember-latest.js:15446
Ember.StateManager.Ember.State.extend.send ember-latest.js:15431
DS.Model.Ember.Object.extend.send ember-data-latest.js:3058
DS.Store.Ember.Object.extend.load ember-data-latest.js:1737
DS.Store.Ember.Object.extend.loadMany ember-data-latest.js:1763
embeddedFindRecord ember-data-latest.js:3434
hasAssociation ember-data-latest.js:3459
ComputedPropertyPrototype.get ember-latest.js:2968
get ember-latest.js:1362
getPath ember-latest.js:1484
get ember-latest.js:1355
getWithGlobals ember-latest.js:4041
Binding.connect ember-latest.js:4140
connectBindings ember-latest.js:4600
finishPartial ember-latest.js:4610
Class ember-latest.js:8315
Ember.Mixin.create.create ember-latest.js:8457
Ember.View.Ember.Object.extend.createChildView ember-latest.js:13179
Ember.View.states.inBuffer.appendChild ember-latest.js:13622
Ember.View.Ember.Object.extend.invokeForState ember-latest.js:12239
Ember.View.Ember.Object.extend.appendChild ember-latest.js:13058
EmberHandlebars.ViewHelper.Ember.Object.create.helper ember-latest.js:18687
(anonymous function) ember-latest.js:18844
(anonymous function) ember-latest.js:19043
(anonymous function) ember-latest.js:19208
(anonymous function)
(anonymous function) handlebars-1.0.0.beta.6.js:1512
Ember.View.Ember.Object.extend.render ember-latest.js:12223
Ember.View.Ember.Object.extend.renderToBuffer ember-latest.js:12872
Ember.View.states.inBuffer.appendChild ember-latest.js:13625
Ember.View.Ember.Object.extend.invokeForState ember-latest.js:12239
Ember.View.Ember.Object.extend.appendChild ember-latest.js:13058
EmberHandlebars.ViewHelper.Ember.Object.create.helper ember-latest.js:18687
(anonymous function) ember-latest.js:18844
program2
(anonymous function) handlebars-1.0.0.beta.6.js:1529
Ember.View.Ember.Object.extend.render ember-latest.js:12223
Ember._HandlebarsBoundView.Ember._MetamorphView.extend.render ember-latest.js:18075
Ember.wrap.newFunc ember-latest.js:949
Ember.View.Ember.Object.extend.renderToBuffer ember-latest.js:12872
Ember.View.states.inBuffer.appendChild ember-latest.js:13625
Ember.View.Ember.Object.extend.invokeForState ember-latest.js:12239
Ember.View.Ember.Object.extend.appendChild ember-latest.js:13058
bind ember-latest.js:18129
(anonymous function) ember-latest.js:18199
(anonymous function) ember-latest.js:18271
program1
(anonymous function) handlebars-1.0.0.beta.6.js:1529
Ember.View.Ember.Object.extend.render ember-latest.js:12223
Ember.View.Ember.Object.extend.renderToBuffer ember-latest.js:12872
Ember.ContainerView.Ember.View.extend.render ember-latest.js:14078
Ember.View.Ember.Object.extend.forEachChildView ember-latest.js:12486
Ember.ContainerView.Ember.View.extend.render ember-latest.js:14077
Ember.wrap.newFunc ember-latest.js:949
Ember.View.Ember.Object.extend.renderToBuffer ember-latest.js:12872
Ember.View.states.inBuffer.appendChild ember-latest.js:13625
Ember.View.Ember.Object.extend.invokeForState ember-latest.js:12239
Ember.View.Ember.Object.extend.appendChild ember-latest.js:13058
EmberHandlebars.ViewHelper.Ember.Object.create.helper ember-latest.js:18687
(anonymous function) ember-latest.js:18844
(anonymous function) ember-latest.js:19043
(anonymous function) ember-latest.js:19208
(anonymous function)
(anonymous function) handlebars-1.0.0.beta.6.js:1512
Ember.View.Ember.Object.extend.render ember-latest.js:12223
Ember.View.Ember.Object.extend.renderToBuffer ember-latest.js:12872
Ember.ContainerView.Ember.View.extend.render ember-latest.js:14078
Ember.View.Ember.Object.extend.forEachChildView ember-latest.js:12486
Ember.ContainerView.Ember.View.extend.render ember-latest.js:14077
Ember.wrap.newFunc ember-latest.js:949
Ember.View.Ember.Object.extend.renderToBuffer ember-latest.js:12872
Ember.View.states.inBuffer.appendChild ember-latest.js:13625
Ember.View.Ember.Object.extend.invokeForState ember-latest.js:12257
Ember.View.Ember.Object.extend.appendChild ember-latest.js:13058
EmberHandlebars.ViewHelper.Ember.Object.create.helper ember-latest.js:18687
(anonymous function) ember-latest.js:18844
(anonymous function) ember-latest.js:19624
(anonymous function) ember-latest.js:18167
(anonymous function)
(anonymous function) handlebars-1.0.0.beta.6.js:1512
Ember.View.Ember.Object.extend.render ember-latest.js:12223
Ember.View.Ember.Object.extend.renderToBuffer ember-latest.js:12872
Ember.View.Ember.Object.extend.createElement ember-latest.js:12669
Ember.View.states.preRender.insertElement ember-latest.js:13558
Ember.View.Ember.Object.extend.invokeForState ember-latest.js:12257
invoke ember-latest.js:3428
iter ember-latest.js:3475
RunLoop.flush ember-latest.js:3531
RunLoop.end ember-latest.js:3447
Ember.run.end ember-latest.js:3639
autorun ember-latest.js:3705

谢谢你的帮助

---

更新：可以工作（以中为例），但是如果标记不是真实的模型（即），如何表示这些对象呢？

如果您绝对需要与服务器交换自定义数据结构，您可以丰富

DS.attr.transforms

并声明一个新的

数组

编解码器

---

有关现有属性编解码器的实现，请参见。这是一个开始添加自己的代码的好地方。

这里的游戏有点晚了，但我发现了一个jFiddle，它是声明新阵列编解码器的一个简单实现

---

以下是在余烬数据（版本10）中创建自定义数组类型的示例：

现在，您可以在模型属性中使用自定义类型：

App.CalenderWeek = DS.Model.extend
  selected_days = DS.attr('array')

现在，当您使用以下命令获取记录时：

App.CalendarWeek.find(1)

这两个传入的json记录都将正确反序列化到数组中：

{ selected_days: ['Monday', 'Tuesday', 'Saturday'] }

或

---

我使用了一个

raw

变换，在ember data revision 11中如下所示：

DS.RESTAdapter.registerTransform('raw', {
    deserialize: function(serialized) {
        return serialized;
    },  
    serialize: function(deserialized) {
        return deserialized;
    }   
});

然后，在模型中，我执行以下操作：

App.MyModel = Ember.Model.extend({
    anArray: DS.attr('raw')
});

---

并且可以像在任何地方使用常规数组一样使用

anArray

。

在余烬数据1.0.0 Beta版中，可以“注册”他或她的自定义转换“子类”。我更愿意将其称为扩展的

DS.Transform

对象

DS.ArrayTransform = DS.Transform.extend({
    deserialize: function(deserialized) {
        // ...
        return deserialized;
    },

    serialize: function(serialized) {
        // ...
        return serialized;
    }
});

App.register('transform:array', DS.ArrayTransform);

---

嗯。。。这有点难，但在这篇文章中混合了所有的答案，我让它成功了

首先，您应该为新类型“array”创建一个转换：

现在，在您的模型中，只需将其用作另一个属性：

App.myModel = Ember.Model.extend({
    name : DS.attr('string'),
    cont : DS.attr('array')
}

我们完成了。 请记住，在向数组添加元素时，请使用pushObject

在控制器中：

this.get('model.cont').pushObject('new Item');

---

我希望这能帮助一些人。

有趣的是，这个问题的所有其他4个答案都有几乎相同的反序列化和序列化函数，因此您可以将问题简化为：

import Em from 'ember'
import DS from 'ember-data'

# Presumably based on these answers: http://stackoverflow.com/questions/12168570/how-to-represent-arrays-within-ember-data-models
# All we need to do is always make sure an array is returned from serialize or deserialize

toArray = (data) ->
  switch Em.typeOf(data)
    when 'array'  then data
    when 'string' then JSON.parse(data)
    else []

export default DS.Transform.extend
  deserialize: toArray
  serialize: toArray

---

---

这是用于coffeescript的

导入/导出

支持

是否只是定义了一个常用的数组属性不起作用？我用小提琴更新了它。我该怎么做呢？嗯，我想如果你想保留你的标签，你必须把它们描述成DS.Model。如果不是，那么只需在Person模型中声明一个常用数组。最后，也许我不明白您想要什么……我创建了一个fiddle，其中标记声明为常规的余烬对象：fixture就是我从服务器接收到的一个示例。所以，一个普通的余烬对象就可以了，但是我如何将它附加到模型上呢？我确实需要从数据库中加载它，但我不关心如何操作它。这可能吗/这里有最佳实践吗？这似乎不适用于EM 11。但什里扬的提交确实如此。这确实是一个很好的实现。我的应用程序中也有相同的…：-）如果使用此解决方案以部分方式呈现数据-请查看此处的解决方法->这非常有效，感谢您的示例和解释。为什么不将此设置为答案？嘿@BrandonJMcKay，如何编辑数组并将其保存回有效负载。编辑现有数组时，我看不到任何绑定。@iOSdev，嗯。。。为什么不问问@Bommox？我没有提供任何信息，但我想你可能正在寻找一个，或者一个。转换会修改传入/传出的数据，但它适用于特定的数据类型。没别的了。如果您使用的是单词payload，我想您需要一个序列化程序或适配器。这非常适合我的需要（FIXTURE中的一个简单数组），使用{{each}来显示数组值。谢谢这是文档中显示的方法，因此我将其称为“余烬方式”：此语法似乎已被弃用，请参阅@PatrickFisher的链接。优点是，它允许您设置DS.attr defaultValue，其中as.attr（null，defalutValue:[]）不起作用。我没有看到弃用通知？页面上的哪个版本/位置？当我更改所选天数时，这不会在模型上设置isDirty标志。这是一个已知问题吗？@J.Mitchell您是否能够解决isDirty问题。甚至，我也看不到模型会随着把手中更改的值而更新。请告诉我们需要在哪个文件中添加此代码。@Rajangendrakumar将其添加到您有权访问

DS

变量的文件中。您是将其作为导入变量还是全局变量？

DS.ArrayTransform = DS.Transform.extend({
  deserialize: function(serialized) {
    return (Ember.typeOf(serialized) == "array")
        ? serialized 
        : [];
  },

  serialize: function(deserialized) {
    var type = Ember.typeOf(deserialized);
    if (type == 'array') {
        return deserialized
    } else if (type == 'string') {
        return deserialized.split(',').map(function(item) {
            return jQuery.trim(item);
        });
    } else {
        return [];
    }
  }
});

App.register("transform:array", DS.ArrayTransform);

App.myModel = Ember.Model.extend({
    name : DS.attr('string'),
    cont : DS.attr('array')
}

this.get('model.cont').pushObject('new Item');

import Em from 'ember'
import DS from 'ember-data'

# Presumably based on these answers: http://stackoverflow.com/questions/12168570/how-to-represent-arrays-within-ember-data-models
# All we need to do is always make sure an array is returned from serialize or deserialize

toArray = (data) ->
  switch Em.typeOf(data)
    when 'array'  then data
    when 'string' then JSON.parse(data)
    else []

export default DS.Transform.extend
  deserialize: toArray
  serialize: toArray