Module 'initializer' fires twice about knockout-amd-helpers

[rniemeyer]

I think that I would have to see more code to help pin this one down. If you are using an observable to track the "current" module, then you will want to make sure that it is not getting set twice by the routing. You could check by creating a manual subscription against it and log out the value. Something like:

this.currentModule = ko.observable();
this.currentModule.subscribe(function(newValue) {
    console.log("module changed", newValue);
}, this);
```'
I am happy to help you out. Let me know if you have any additional code.  A simple throttle may help, but hard to say without seeing more.  Thanks!

[vishnurk]

That was quick! Thanks for your response. Here is some more information..
So, I have a global view(which is my main HTML page) with its corresponding view model setup like below -

Main view - HTML page

      <div class="container">
          <div data-bind="module: {
                                name:MainModule.name,
                                template:MainModule.template,
                                data:MainModule.data,
                                initializer: 'Initialize',
                                disposeMethod: 'Dispose' 
                             }">            
         </div>
      </div>

main view model - code snippet

    //set to default values initially until a route gets activated
      var mainModule = {
                            type:'main',
                            name: ko.observable(" "),
                            template: ko.observable(" "),
                            data: ko.observable(null)
                          },
    //on route activation, the router calls the 'activatemodule' function below
    // passes in a module definition for a module that needs to be activated.
      activateModule = function (moduleDefinition) {
         if (typeof moduleDefinition !== 'undefined' && moduleDefinition!==null) {
            if (moduleDefinition.type == config.moduleTypes.main) {
               //activate module
               mainModule.name(moduleDefinition.name);
               mainModule.template(moduleDefinition.template);
               mainModule.data(moduleDefinition.data);
            } 
         }
      };

router - code snippet

    //sample get route. 
    //more routes setup w/ corresponding activation calls like below.
    sammy.get('#login', function () {
           vm.ActivateModule({
                                         type:'main',
                                         name: "vm.login",
                                         template: "login",
                                         data: {name:"Hello World"} 
                                         })
    });

Not sure if this is clear enough. Let me know what you think of the setup.

[vishnurk]

Btw, I tried your suggestion and implemented manual subscriptions on mainModule.template & mainModule.name. Ran a quick test and verified that the template & the name are getting set only once, but, the initializer was getting called twice.

[rniemeyer]

The binding will depend on both the template and name in your case. Setting them sequentially will cause the binding to fire twice.

You could either set it all at once:

mainModule.module({
     template: yourTemplate, 
     name: yourName
});

or create a computed that you throttle that returns it as an object

module = ko.computed(function() {
    return {
          template: this.template(),
          name: this.name()
    };
}, this).extend({ throttle: 1 });

This does give me a thought to actually throttle it within the library itself, but would take some investigation/testing to understand how/what it could break.

As a final option, you could choose to make template a non-observable, and set it prior to setting name, if you don't need to ever just change the template.

Hope that helps!

[vishnurk]

Thanks, Ryan.
As for the 1st option, I initially suspected that sequentially setting the 'template' and 'name' was causing the 'initializer' to fire twice - so, I matched the view & view model names and made only the module 'name' observable. The 'initializer' still fired twice ONLY when using the browser back button.

Also, another piece of information - I do have a navigation module (other than the main module) defined on the main HTML page which is dynamically bound as well depending on the route. Not sure at this point if this could be causing this issue.

Will give your recommendations a try and get back to you.

Thanks again.

[vishnurk]

Quick update on this issue - It was the sequential setting of the module init data (after setting template & name) that caused the 'initializer' to fire twice. Got past it by setting template,name & data all at once as recommended by you. It's definitely much cleaner than setting them separately.

Thanks again for your help.

[rniemeyer]

@vishnurk - great. glad that you got it settled. Let me know if you run into any additional problems/issues.