Geek asks and answers

Array array Ember.js ArrayProxy

purpose

To create an array of models driven by an ArrayController (ArrayProxy). Requirements

Use the ArrayController (ArrayProxy) abstraction to encapsulate an array of models Automatically convert objects to ArrayProxy when pasting into ArrayProxy Non lazy conversion during access

Data structure examples

App.AddressModel = Ember.Object.extend({
    address_name: null,
    address: null,
    printme: function() {
        console.log("Just making sure the array turned into an AddressModel");
    },
});

App.addressArray = Ember.ArrayProxy.create({
    transformFrom: function(item) {
    },
    transformTo: function(item) {
    },
    arrayContentWillChange: function(startIdx, removeAmt, addAmt) {
    },
});

Protocol Failures

dynamic property

Someone on the IRC channel mentions trying dynamic properties. This led to what turned out to be logical and empirical evidence, a recursive result. Undoubtedly, due to the creation of the content, both the dynamically generated variable and the trigger / exported variable.

arrayContentWillChange

, . arrayContentWillChange, AddressModel () . , arrayContentWillChange , ... recurse.

transformFrom/transformTo

https://github.com/emberjs/ember.js/pull/554#issuecomment-5401112 tomdale , transformFrom transformTo / . , , [http://cloud.github.com/downloads/emberjs/ember.js/ember-0.9.8.js].

ArrayProxy

https://github.com/emberjs/ember.js/pull/554 tomdales / , -, , , jedwood, Backbone.js , , .

ArrayProxy , , AddressModel?

+5
1

, , replace. content, , , . http://jsfiddle.net/pangratz666/XCLmE/:

App.ModelArrayProxy = Ember.ArrayProxy.extend({
    modelType: Ember.required,

    _typedArray: function(objects) {
        var modelType = this.get('modelType');
        var array = objects.map(function(item) {
            // check if item is an instance of type
            if (!(item instanceof modelType)) {
                // create a new instance of type and pass the hash
                return modelType.create(item);
            }

            // just return the item, since it already of type modelType             
            return item;
        });
        return array;
    },

    contentChanged: function() {
        if (!this.get('setTypedContent')) {
            var content = this.get('content');

            this.set('setTypedContent', true);
            this.set('content', this._typedArray(content));
            this.set('setTypedContent', false);
        }
    }.observes('content'),

    replace: function(idx, amt, objects) {
        this._super(idx, amt, this._typedArray(objects));
    }
});

Then this ModelArrayProxy can be used as "normal" ArrayProxy:

// model declaration
App.AddressModel = Ember.Object.extend({
    ...
});

// create a proxy for given modelType
App.proxy = App.ModelArrayProxy.create({
    content: [],
    modelType: App.AddressModel
});

var myArray = [{
    address_name: 'address_name 1',
    address: 'address 1'},
{
    address_name: 'address_name 2',
    address: 'address 2'}];

// set content with "normal" objects
App.proxy.set('content', myArray);

// invoke 'log' on all items in array
App.proxy.forEach(function(item) {
    item.log();
});

// push a normal object
App.proxy.pushObject({
    address_name: 'address_name 3',
    address: 'address 3'
});

// push an instance of App.AddressModel
App.proxy.pushObject(App.AddressModel.create({
    address_name: 'address_name 4',
    address: 'address 4'

}));

// invoke 'log' on all items in array
App.proxy.forEach(function(item) {
    item.log();
});​
+5
source

More articles:


All Articles