Dependency Observables fail in Collections about jsblocks

[astoilkov]

Hi,

Yeah. This is actually expected. The reason is fullCake is part of the App.Model prototype. JavaScript prototypes are the same for all objects and do not getted cloned. I am cloning regular observables but not dependency ones. You could resolve your issue by using the code below which creates a new fullCake variable every time a Cake Model is created.

var App = blocks.Application();

var Cake = App.Model({
    cakeType: blocks.observable(),
    cakeSize: blocks.observable(),

    init: function () {
      this.fullCake = blocks.observable(function() {
        return this.cakeType() + 'cake (' + this.cakeSize() + ')';
      }, this);
    }
})

var Cakes = App.Collection(Cake);

App.View('Bakery', {
    cakes: Cakes([
        { cakeType: 'strawberry', cakeSize: 'small' },
        { cakeType: 'chocolate', cakeSize: 'large' }
    ])
});

Additionally, I will leave this issue open to think about if there could be a way to fix the problem.

[cybrox]

Hi

Thanks for the prompt reply!
I got the code working with your solution.

As for solving the problem, I haven't really looked into jsblocks any deeper but spontaneously, I'd say it could be nice having a self-reference in dependency observables that can access the instance data. I'm thinking about not cloning the function prototype but internally passing it a self variable which contains the data of the current context.

For anyone interested, another solution I just figured that I personally like more (at least code-style wise) is using the following code:

var Cake = App.Model({
            cakeType: blocks.observable(),
            cakeSize: blocks.observable(),

            fullCake: function(self) {
                return self.cakeType() + 'cake (' + self.cakeSize() + ')';
            },
});

    <div data-query="view(Bakery)">
        <div data-query="each(cakes)">
            <h2>Let's eat some, {{fullCake($this)}}!</h2>
        </div>
    </div>

[astoilkov]

Hmm. Yes. This is interesting idea. I really like how you approached the problem. I will think about it and update you on the status.

Thanks.

[astoilkov]

I have fixed the problem. Now you can use the code from your first post and it will work how it is expected.