Ext.require not working

Question

I am building a sencha touch application in which I have a class defined outside of app folder, how to load that class dynamically.

Application Structure looks like below:

assets
   -> Assignment
          -> controller
                 -> AssignmentAPI
   -> Application
          -> app
                -> controller
                     -> LoadAssignment
          -> app.js

AssignmentAPI:

Ext.define('Assignment.controller.AssignmentAPI', {
          extend:'Ext.app.Controller',

              statics: {

                    getAssignments: function() {

                    }
              }
});

LoadAssignment:

 Ext.define('Application.controller.LoadAssignment', {
             extend:'Ext.app.Controller',


             requires: [
             ],

             statics: {
                    populateAssignments: function() {

                         Ext.require(['Product.controller.AssignmentAPI']);

             var assignmentAPI = Ext.ClassManager.get('Assignment.controller.AssignmentAPI');           
             //Assignment API is coming as NULL

             assignmentAPI.getAssignments()
                    }
             }  

});

app.js

 Ext.Loader.setPath({
       'Ext':      'sdk/src',
       'Assignment': '../Assignment'
  });

Note*: If I specify Task.controller.AssignmentAPI class in requires:[] of LoadAssignment class then it works fine, but loading Assignment.controller.AssignmentAPI using Ext.require() does not work.

Answer 1

Ext.require() is asynchronous, so the class hasn't been included by the time it hits your Ext.ClassManager.get() line.

You could use syncRequire() - but using "requires" on the class definition is a far better practice.