Geek asks and answers

Dojo 1.7 how to use Dojo components outside require ()

I created a Dojo widget as shown below using the AMD bootloader in Dojo 1.7.2

var myCpane;

require([
            "dijit/layout/ContentPane"
        ], function(ContentPane) {
        myCpane = new ContentPane();
});

myCpane.startup();  // It gives 'myCpane' as undefined

In the above example, in the last status, the variable "myCpane" goes as "undefined", if I use "myCpane.startup ()" inside the require () callback function, then it will work fine.

But I want to use this variable "myCpane" outside the function "require" (for many reasons) . I know that the execution of the callback (require () "function is delayed due to the loading process of the Dojo component.

My question is:

  • How to block the require () function until it completes the execution of this callback function.

, "myCpane" "undefined", "require()"

=============================================== ============

,

LoadModule: function(modulePath) { // modulePath = "dijit/layout/ContentPane" 
        var moduleObject = undefined; 

        require({async:  false}, [modulePath], function(getModuleObject) { 
                moduleObject = getModuleObject; 
        }); 

        // Wait until the module loads completes 
        while(moduleObject === undefined); 

        // Return the loaded module. 
        return moduleObject; 
}

while, require(), "moduleObject".

require() ? , , "ContentPane.js" , . while, .

?

+3
2

, , , -. dojo/_base/Deferred:

require(["dojo/_base/Deferred"], function(Deferred) {

    var deferred = new Deferred();

    require(["dijit/layout/ContentPane"], function(ContentPane) {
        var myCpane = new ContentPane();
        deferred.resolve(myCpane); //resolve, i.e. call `then` callback
    });

    deferred.then(function(myCpane) {
        console.log(myCpane);
        myCpane.startup();
    });

});​

jsFiddle: http://jsfiddle.net/phusick/HYQEd/

, :

  • ContentPane a id dijit registry.byId().

  • ContentPane :

    // file: myCpane.js
define(["dijit/layout/ContentPane"], function(ContentPane) { 
    var myCpane = new ContentPane();
    return myCpane;
});


// file: main.js
require(["./myCpane"], function(myCpane) {
    myCpane.startup();
});
+3

, , ;

var x;
function foo() {
  x = { bar : 1 };
}

// you wouldn't expect to have reference to x variable here
if(typeof x.bar == "undefined") console.log(x);
// foo() is called at a random time - or in dojo loader case, when modules are present
foo();
console.log(x.bar); // oohh now its there ^^

x myCpane, (var $$) , , , , .

, . , , youre allready () . require(), :

var myCpane;

require({ async:  false  }, [
            "dijit/layout/ContentPane"
        ], function(ContentPane) {
        myCpane = new ContentPane();
});
// require does not return until module loading is done and callback executed
myCpane.startup();
+1

More articles:


All Articles