Emberjs - 修改阵列

Question

我对Ember有一些问题，我不太明白。我有一个数组是这样的：

var device.images = [ 
    0: { 
     url: "url", 
     key: "key" 
    }, 
    1: "url2", 
    2: "url3", 
    3: "url4" 
];' 

而且在我的控制器，一个地图里我尝试从数组修改每一个项目这样做：

device.images[idx] = image;

image是一个新的对象，看起来就像我的数组中的第一项。但是，我总是得到断言失败：

Assertion Failed: You must use Ember.set() to access this property (of [object Object]...

我该如何解决呢？因为这通常不适用？

[编辑]下面是完整的代码：

loadGallery: function(device) { 

     var that = this; 
     var images = device.images.map(function(item, idx) { 
      return new Ember.RSVP.Promise(function(resolve) { 
       if (item.url) { 
        resolve(item); 
       } 
       else { 
        resolve(that.imageStore.readImage(that, item)); 
       } 
      }) 
      .then(function(image) { 
       device.images.set(idx, image); 
       that.set('selectedItem.images', device.images); 
       return image; 
      }); 
     }); 
     return Ember.RSVP.Promise.all(images); 
    }, 

Answer 1

[编辑：第一次尝试是错误]

看来你应该能够使用item[index] = value结构。实例：

App.IndexRoute = Ember.Route.extend({ 
    resolveImage: function (that, item) { 
    return { 
     url: item, 
     key: "resolved" 
    }; 
    }, 
    model: function() { 
    var device = { 
     images: [ 
     {url: "a", key: "existing"}, 
     "b", 
     "c" 
     ] 
    }; 
    var that = this; 
    var images = device.images.map(function(item, idx) { 
     return new Ember.RSVP.Promise(function(resolve) { 
     if (item.url) { 
      resolve(item); 
     } 
     else { 
      resolve(that.resolveImage(that, item)); 
     } 
     }) 
     .then(function(image) { 
     device.images[idx] = image; 
     return image; 
     }); 
    }); 
    return Ember.RSVP.hash({ 
     model: Ember.RSVP.Promise.all(images), 
     device: device 
    }); 
    }, 
    setupController: function (c, m) { 
    c.set("model", m.model); 
    c.set("device", m.device); 
    } 
}); 

<script type="text/x-handlebars" data-template-name="index"> 
    <h2>From model</h2> 
    <ul> 
    {{#each item in model}} 
     <li>{{item.url}} - {{item.key}}</li> 
    {{/each}} 
    </ul> 
    <h2>From device</h2> 
    <ul> 
    {{#each item in device.images}} 
     <li>{{item.url}} - {{item.key}}</li> 
    {{/each}} 
    </ul> 
    </script> 

JSBin here。

除非一些bug其他地方在你的代码，剩下的唯一的解决办法是，你正在使用Ember.Data和images是不是一个真正的数组，但，仅仅实现了一个或几个Ember的阵列/枚举混入的自定义类。 [...]构造是一种语法糖，它被硬编码为JavaScript，不可供库作者覆盖。

我帮不了你，因为我不使用Ember.Data。您可以尝试使用Ember.MutableArray界面中的显式阵列突变方法。例如：

device.images.replace(idx, 1, [image]); 

另外，使用object.set(key, value)结构（我的第一个建议），有需要提醒的是键值必须是字符串。例如：

device.images.set(String(idx), image); 

如果这些都不起作用，您可以尝试建立一个新的数组，而不是替换现有的成员。