Question

我的问题有点奇怪，因为我不明白这是如何工作的。我的页面上有一个项目列表列表，当用户点击一个时，这将触发一个动作事件，该事件也将接收被点击的产品（对象）。

当动作处理程序被触发时，我正在调用loadGallery（见下文），它通常应该在我的模板中逐个呈现我的图像。 SelectedItem是我的控制器的属性。

   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 ) {
                var imageURLs = device.imageURLs.slice( 0, device.imageURLs.length );
            imageURLs[idx] = image.url;
            //that.set('selectedItem.imageURLs.'+idx, image.url );
            that.set('selectedItem.imageURLs', imageURLs );
            that.set('selectedItem.images.' + idx, image );
            return image;
            });
        });
        return Ember.RSVP.Promise.all( images );
    },

我在这里做的是，我用这样的对象替换数组device.images中的每个网址：{ key: 'someKey', url: 'url' }

但我的模板去那里时不会刷新..

我设法使其工作的唯一方法是，等待所有图像完成加载并刷新属性：

return Ember.RSVP.Promise.all( images ).then(function(imgs){
            that.set('selectedItem.images', imgs);
        });

为什么这个有效但不是一个一个的形象？

[edit]这是我的模板：

<div class="gallery">
    {{#each img in selectedItem.images}}
        {{#if img.url}}
            <div href="{{unbound img.url}}" class="gallery-item" style="background-image: url({{unbound img.url}})"></div>
        {{else}}
            <div class="gallery-item" style="background-image: url(images/loading.png)"></div>
        {{/if}}
    {{/each}}
</div>

这是readImage函数：

  this.readImage = function( controller, key ) {
        var that = this;
        return new Ember.RSVP.Promise(function( resolve ) {
            controller.store.findQuery( 'image', { key: key })
            .then(function( image ) {
                var result = undefined;
                var content = image.content[0];
                var data = content && content._data;
                if( data ) {
                    if ( iOSVersion()[0] >= 7 || isBlobSupported() ) {
                        result = {
                            key: key,
                            url: dataURIToURL( data.base64, key )
                        }
                    } else {
                        result = {
                            key: key,
                            url: data.base64
                        }

                    }
                }
                resolve( result );
            })
            .catch(function( e ) {
                console.log( e );
                resolve();
            });
        });
    };

Answer 1

Ember忽略相同值的集合（数组，相同引用的对象）。

它在你的承诺中起作用的原因是它创造了一个新阵列，而Ember认为它是不同的。

这也看起来像是在尝试索引设置集合中的项目。尽管这个功能正常（一些隐藏的Ember I黑魔法从未见过）但它并没有正确通知Ember项目已经改变，例如http://emberjs.jsbin.com/cevimara/1/edit

device.images.set( idx+'', image );

你可能会尝试切换到替换（http://emberjs.com/api/classes/Ember.ArrayProxy.html#method_replace）

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

示例：http://emberjs.jsbin.com/cevimara/1/edit

Emberjs - 逐一渲染画廊形象

1 个答案: