Results 1 to 8 of 8

Thread: Initial ViewModel data not firing formula

  1. #1
    Sencha User
    Join Date
    Mar 2011
    Location
    Arvada, CO
    Posts
    404
    Answers
    11

    Default Answered: Initial ViewModel data not firing formula

    I have a ViewModel that contains some initial data... this initial data is based off of a global variable that I have created. In the ViewModel, I have a formula that does some logic based on the data set from the global variable. The interesting thing is, this formula does not fire when the ViewModel is created. I'm assuming this is because the Something.Test property does not exist, so the ViewModel internals have some smarts to not fire the method if that property does not exist.

    If the property doesn't exist, how do I fire the formula anyway? I know I could look for Something check to see if it has the property Test, but I'm curious why this example wouldn't work. Here's the
    example:

    Code:
    Ext.application({
        name : 'Fiddle',
    
        launch : function() {
            // Define global var Something
            Ext.define('Something', {
                singleton: true
            });
            Ext.define('MyViewModel', {
                extend: 'Ext.app.ViewModel',
                alias: 'viewmodel.myView',
                data: {
                    Something: window.Something
                },
                formulas: {
                    testSomething: function(getter) {
                        console.log('here', getter('Something.Test'));
                        return getter('Something.Test');
                    },
                    myTitle: function(getter) {
                        return 'My Title';
                    }
                }
            });
            Ext.define('MyView', {
                extend: 'Ext.panel.Panel',
                bind: {
                    title: '{myTitle}'
                },
                viewModel: {
                    type: 'myView'
                }
            });
            var view = Ext.create('MyView', {
                renderTo: Ext.getBody()
            });
            console.log(Something, window.Something)
        }
    });

  2. The formula is never called because there's nothing bound to it, so there's no reason for it to evaluate.

  3. #2
    Sencha Premium User evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    19,253
    Answers
    759

    Default

    The formula is never called because there's nothing bound to it, so there's no reason for it to evaluate.
    Twitter - @evantrimboli
    Former Sencha framework engineer, available for consulting.
    As of 2017-09-22 I am not employed by Sencha, all subsequent posts are my own and do not represent Sencha in any way.

  4. #3
    Sencha User
    Join Date
    Mar 2011
    Location
    Arvada, CO
    Posts
    404
    Answers
    11

    Default

    Well I am binding Something.Test to it, but you mean the property Test is not defined... so I figured even though it's not an actual defined property on the global var, it still technically can be seen as undefined, which is why I thought the formula would fire, but I'm wrong, so thank you for clearing that up.

  5. #4
    Sencha Premium User evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    19,253
    Answers
    759

    Default

    I meant that nothing is requesting the value of "testSomething". Since nothing is asking for it, it doesn't need to evaluate.
    Twitter - @evantrimboli
    Former Sencha framework engineer, available for consulting.
    As of 2017-09-22 I am not employed by Sencha, all subsequent posts are my own and do not represent Sencha in any way.

  6. #5
    Sencha User
    Join Date
    Mar 2011
    Location
    Arvada, CO
    Posts
    404
    Answers
    11

    Default

    I actually figured out what the issue was... in my actual code, MyView and MyViewModel are in a package, while defining the global var Something is in my app... the package gets included first, and window.Something is undefined, thus it will never be updated in the ViewModel after Something is defined, as an undefined var is a primitive. So basically, I need to figure out how to include my global var before that package loads.

  7. #6
    Sencha User
    Join Date
    Mar 2011
    Location
    Arvada, CO
    Posts
    404
    Answers
    11

    Default

    @evant, why would this formula not fire? Is it because there's an undefined variable being referenced still? Seems a bit strange that an entire function would just not fire because of that, even though I am checking a defined variable... if anything, the value should just return as undefined and the rest of the function should go. Example:
    Code:
    Ext.application({
        name : 'Fiddle',
    
        launch : function() {
            // Define global var Something
            Ext.define('Something', {
                singleton: true
            });
            Ext.define('MyViewModel', {
                extend: 'Ext.app.ViewModel',
                alias: 'viewmodel.myView',
                data: {
                    Something: window.Something,
                    blah: 1
                },
                formulas: {
                    testSomething: function(getter) {
                        console.log('here', getter('Something.Test'));
                        return getter('blah');
                    },
                    myTitle: function(getter) {
                        return 'My Title';
                    }
                }
            });
            Ext.define('MyView', {
                extend: 'Ext.panel.Panel',
                bind: {
                    title: '{myTitle}'
                },
                viewModel: {
                    type: 'myView'
                }
            });
            var view = Ext.create('MyView', {
                renderTo: Ext.getBody()
            });
            console.log(Something, window.Something)
        }
    });

  8. #7
    Sencha Premium User evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    19,253
    Answers
    759

    Default

    For the same reason, nothing is bound to '{testSomething}'. Since nothing is requesting the result, it won't be evaluated.

    Change:

    Code:
    bind: {
        title: '{testSomething}'
    }
    Then it will run.
    Twitter - @evantrimboli
    Former Sencha framework engineer, available for consulting.
    As of 2017-09-22 I am not employed by Sencha, all subsequent posts are my own and do not represent Sencha in any way.

  9. #8
    Sencha User
    Join Date
    Mar 2011
    Location
    Arvada, CO
    Posts
    404
    Answers
    11

    Default

    Quote Originally Posted by evant View Post
    For the same reason, nothing is bound to '{testSomething}'. Since nothing is requesting the result, it won't be evaluated.

    Change:

    Code:
    bind: {
        title: '{testSomething}'
    }
    Then it will run.
    Yeah but if I change the console.log to output getter('blah'), it does run, even though nothing is requesting it... that's very confusing. A normal function does not pick and choose when it runs.

Similar Threads

  1. [FIXED] store undefined while loading in a viewmodel formula
    By pscanlon1 in forum Ext 5: Bugs
    Replies: 4
    Last Post: 15 Sep 2016, 7:24 AM
  2. Calling superclass formula in ViewModel
    By valio in forum Ext 5: Q&A
    Replies: 1
    Last Post: 28 Jul 2015, 7:55 AM
  3. Replies: 1
    Last Post: 1 Apr 2015, 6:24 PM
  4. Replies: 1
    Last Post: 10 Mar 2015, 1:04 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •