Emberjs - 空模型加载更快

时间:2014-05-22 16:58:09

标签: ember.js

是否可以从模型中返回一个空对象以更快地加载html?因为我知道页面正在等待设置模型,所以我想知道是否有人试图这样做。

App.ApplicationRoute = Ember.Route.extend({
    model: function() {
        return;
    },
    setupController: function(controller, model) {

        controller.set('model', this.store.find('user'));
    }
})

当然这不起作用......但它应该更新模型吗?

[编辑]

我的路线:

App.ProductData = Ember.ObjectProxy.extend(Ember.PromiseProxyMixin)

    App.ApplicationRoute = Ember.Route.extend({
        setupController: function( controller, model) {
            this._super(controller, this.getProductData());
        },
        getProductData: function() {
            var that = this;

            var promise = $.getJSON('js/product.json').then( function( data ) {
                data = data.map(function( item, idx ) {
                    item.key = idx;
                    item.product = true;
                    item.imagesBase64 = [];
                    return item;
                });

                var uniqueImageURLs = data.reduce(function( result, item ) {
                    item.images.forEach( function( img ) {
                        result[img] = true;
                    });
                    return result;
                }, {});
                var count = Object.keys( uniqueImageURLs).length;
                that.setProperties({complete: count});

                var saves = data.map(function( item ) {
                    var device = that.store.createRecord( 'device', item );
                    return device.save();
                });
                console.log(data);
            return data;
            }).fail(function( err ) {
                console.log(err);
                var list = that.store.findQuery('device', { product: true });
                return list;
            });// end of getProductData

            return App.ProductData.create({
                promise: promise
            });
        },

    });

我也设置了我的控制器:

App.ApplicationController = Ember.ArrayController.extend({
    selectedItem: undefined,

    actions: {
        selectDevice: function( device ) {
            this.set('selectedItem', device);
        }
    }
})

我用它来获取用户点击的项目。

1 个答案:

答案 0 :(得分:1)

是的,当然会有效,老实说,我唯一能看到的问题是如果你没有定义控制器,Ember会为你建立一个默认的控制器。如果Ember必须根据模型undefined猜测要使用哪个控制器,它将为您提供类似于

的控制器
App.IndexController = Em.Controller.extend()

上面的控制器不会对它上面的模型/集合进行代理获取/设置调用,但如果要定义控制器类型,Ember应该使用它就可以了

App.IndexController = Em.ArrayController.extend();

只要控制器下面的逻辑/路径不依赖于以任何同步方式填充的模型,这是一个非常好的做法。

http://emberjs.jsbin.com/OxIDiVU/504/edit

以下是使用代理承诺的快速示例:

http://emberjs.jsbin.com/OxIDiVU/415/edit

这是一个使用数组代理承诺的例子:

http://emberjs.jsbin.com/OxIDiVU/505/edit