Binding on Multiple custom kind instance

Hi.
I have created a custom kind with a model. Something like this.
enyo.kind({
    name: "customViewModel",
    kind: "enyo.Model",
    attributes: {
        prop1: null,
        prop2: null
    }
});

enyo.kind({
    name: "customView",
    model: new customViewModel(),
    components:[{name:"compA"}]
  
    bindings: [
                    { from: ".model.prop1", to: ".$.compA.content" }
                ]
(…)
})
But when I try to use this kind in a repeater, something wrong happens to the model data. All the views display the same info as the last kind object. It’s like there is the same instance view/model to all the repeated views.
This is how I have the repeater

enyo.kind({
    name: "mainView",
    components: [
        {
            name: "repXPTO",
            kind: "enyo.DataRepeater",
            components: [{
                components: [{
                    kind: "customView", name: "cvItem"
                }],
                bindings: [
                    { from: ".model.prop1", to: ".$.cvItem.model.prop1" },
                    { from: ".model.prop1", to: ".$.cvItem.model.prop1" }
                ]
            }]
        }
    ],

    startApp: function () {
                var collToBind = new Array();
                for (var i = 1; i < 6; i++) {

                    collToBind.push(new customViewModel({ prop1: i, prop2: (i+i) }));
                }
                this.set(".$.repXPTO.collection", new enyo.Collection(collToBind));
    }

});
All de items in the repeater display de number 5, and not 0, 1, 2, 3, 4, 5 as expected.

Anny ideas?

Comments

  • Hmm, can you console.log out your collection, to see what's in the collection? And/or use transform on your bindings to see what values it's receiving?
  • I have put a log in the grid bind transform, and a observer (path: model.prop1) in the kind "customView"
    transformTest repXPTO VAL1 0
    log.js:76 transformTest - repXPTO - customView - observer[model.compA] euid:o45 VAL1 0
    
    log.js:76 transformTest repXPTO VAL2 0
    log.js:76 transformTest - repXPTO - customView - observer[model.compA] euid:o80 VAL2 0
    log.js:76 transformTest - repXPTO - customView - observer[model.compA] euid:o45 VAL2 0
    
    log.js:76 transformTest repXPTO VAL3 0
    log.js:76 transformTest - repXPTO - customView - observer[model.compA] euid:o157 VAL3 0
    log.js:76 transformTest - repXPTO - customView - observer[model.compA] euid:o80 VAL3 0
    log.js:76 transformTest - repXPTO - customView - observer[model.compA] euid:o45 VAL3 0
    


    That is the result.
    It almost looks like after every item created by the repeater, when the bind occurs, its somehow connected to de previous models!
  • Okay. I know DataList uses a flyweight pattern but not sure if DataRepeater does. What may be happening is that DataRepeater is only creating one instance of the view and reusing it. can you try binding the model directly instead of the attributes of the model? Also, if you create jsfiddle, we can play around with it.
  • HI!
    I have tried what you said and nothing :neutral:

    If you notice, i'm printing the control ID (euid) and its always different.
    That makes me think that in fact is another instance of my view.


    What is the use of creating kinds if we are not able to use them multiple times?

    I am surely doing something wrong.

    Here is the fiddle

    http://jsfiddle.net/ahelleno/tc0y6x2r/10/


  • I changed it to bind model directly, rather than individual attributes and then it works:

    http://jsfiddle.net/u5ydLsjd/1/

    Prob something do with flyweight pattern to improve performance but I'd have to look at enyo source code to confirm/deny that.
  • I tried binding the whole model instead of the attributes and it seems that worked. In the customView kind, it is already binding the prop1 to the content.

    In the line 18:
    bindings: [ { from: ".model", to: ".$.cvItem.model" }]
    Is that what you expect?

    Hope it helps.
  • Hi. It worked. Thanks!

    So, for further reference, here is the working fiddler: http://jsfiddle.net/u5ydLsjd/1/

    By the way, is there any "mark as resolved" button in this forums?
  • edited April 2016
    Quick reminder: The leading dot on bindings is neither required nor recommended with Enyo 2.5+.
  • Also to note: All your custom views are sharing the same model instance because you are creating it once during the kind instantiation:

    model: new customViewModel(),

    You might want to create the model in the constructor if you want it to be unique for each custom view. Your binding in the DataRepeater does overwrite the custom view's model, of course.
Sign In or Register to comment.