Skip to main content
added more details to this
Source Link
tk120404
  • 3.1k
  • 1
  • 29
  • 28

We can achieve it by using app.requires

//app.js
    var app = angular.module('myngapp',['ngRoute','ngCookies','ui.bootstrap','kendo.directives','pascalprecht.translate','tmh.dynamicLocale']);

    app.config(['$routeProvider', '$httpProvider', '$translateProvider', 'tmhDynamicLocaleProvider', '$compileProvider', function($routeProvider, $httpProvider, $translateProvider, tmhDynamicLocaleProvider, $compileProvider) {
    'use strict';

    $compileProvider.debugInfoEnabled(false);

    $routeProvider.otherwise({
        redirectTo: '/login'
    });
    }]);

In myModule.js

  app.requires.push('app.myModule');

and in your index.html, include the app.js first and myModule.js next. By this way, you can include n number of modules without modifying the app.js.

Include the myModule.js on the fly from app.js

var mainHead = document.getElementsByTagName('HEAD').item(0);
var myScript= document.createElement("script");
myScript.type = "text/javascript";
mainHead.appendChild( myScript);
myScript.src='../myModule.js';
myScript.onload = function(){
     angular.element(document).ready(function() {
                      angular.bootstrap(document, ['myngapp']);
                     });
     }

Note: here we are manually bootstrapping the application so that dynamically loaded modules are also included into our application

We can achieve it by using app.requires

//app.js
    var app = angular.module('myngapp',['ngRoute','ngCookies','ui.bootstrap','kendo.directives','pascalprecht.translate','tmh.dynamicLocale']);

    app.config(['$routeProvider', '$httpProvider', '$translateProvider', 'tmhDynamicLocaleProvider', '$compileProvider', function($routeProvider, $httpProvider, $translateProvider, tmhDynamicLocaleProvider, $compileProvider) {
    'use strict';

    $compileProvider.debugInfoEnabled(false);

    $routeProvider.otherwise({
        redirectTo: '/login'
    });
    }]);

In myModule.js

  app.requires.push('app.myModule');

and in your index.html, include the app.js first and myModule.js next. By this way, you can include n number of modules without modifying the app.js.

Include the myModule.js on the fly from app.js

var mainHead = document.getElementsByTagName('HEAD').item(0);
var myScript= document.createElement("script");
myScript.type = "text/javascript";
mainHead.appendChild( myScript);
myScript.src='../myModule.js';

We can achieve it by using app.requires

//app.js
    var app = angular.module('myngapp',['ngRoute','ngCookies','ui.bootstrap','kendo.directives','pascalprecht.translate','tmh.dynamicLocale']);

    app.config(['$routeProvider', '$httpProvider', '$translateProvider', 'tmhDynamicLocaleProvider', '$compileProvider', function($routeProvider, $httpProvider, $translateProvider, tmhDynamicLocaleProvider, $compileProvider) {
    'use strict';

    $compileProvider.debugInfoEnabled(false);

    $routeProvider.otherwise({
        redirectTo: '/login'
    });
    }]);

In myModule.js

  app.requires.push('app.myModule');

and in your index.html, include the app.js first and myModule.js next. By this way, you can include n number of modules without modifying the app.js.

Include the myModule.js on the fly from app.js

var mainHead = document.getElementsByTagName('HEAD').item(0);
var myScript= document.createElement("script");
myScript.type = "text/javascript";
mainHead.appendChild( myScript);
myScript.src='../myModule.js';
myScript.onload = function(){
     angular.element(document).ready(function() {
                      angular.bootstrap(document, ['myngapp']);
                     });
     }

Note: here we are manually bootstrapping the application so that dynamically loaded modules are also included into our application

deleted 5 characters in body
Source Link
tk120404
  • 3.1k
  • 1
  • 29
  • 28

We can achieve it by using app.requires

//app.js
    var app = angular.module('myngapp');
    app.requires.push('ngRoute', ['ngRoute','ngCookies', 'ui.bootstrap', 'kendo.directives','pascalprecht.translate', 'tmh.dynamicLocale'dynamicLocale']); 

    app.config(['$routeProvider', '$httpProvider', '$translateProvider', 'tmhDynamicLocaleProvider', '$compileProvider', function($routeProvider, $httpProvider, $translateProvider, tmhDynamicLocaleProvider, $compileProvider) {
    'use strict';

    $compileProvider.debugInfoEnabled(false);

    $routeProvider.otherwise({
        redirectTo: '/login'
    });
    }]);

In myModule.js

  app.requires.push('app.myModule');

and in your index.html, include the app.js first and myModule.js next. By this way, you can include n number of modules without modifying the app.js.

Include the myModule.js on the fly from app.js

var mainHead = document.getElementsByTagName('HEAD').item(0);
var myScript= document.createElement("script");
myScript.type = "text/javascript";
mainHead.appendChild( myScript);
myScript.src='../myModule.js';

We can achieve it by using app.requires

//app.js
 var app = angular.module('myngapp');
    app.requires.push('ngRoute', 'ngCookies', 'ui.bootstrap', 'pascalprecht.translate', 'tmh.dynamicLocale');
    app.config(['$routeProvider', '$httpProvider', '$translateProvider', 'tmhDynamicLocaleProvider', '$compileProvider', function($routeProvider, $httpProvider, $translateProvider, tmhDynamicLocaleProvider, $compileProvider) {
    'use strict';

    $compileProvider.debugInfoEnabled(false);

    $routeProvider.otherwise({
        redirectTo: '/login'
    });
  }]);

In myModule.js

  app.requires.push('app.myModule');

and in your index.html, include the app.js first and myModule.js next. By this way, you can include n number of modules without modifying the app.js.

Include the myModule.js on the fly from app.js

var mainHead = document.getElementsByTagName('HEAD').item(0);
var myScript= document.createElement("script");
myScript.type = "text/javascript";
mainHead.appendChild( myScript);
myScript.src='../myModule.js';

We can achieve it by using app.requires

//app.js
    var app = angular.module('myngapp',['ngRoute','ngCookies','ui.bootstrap','kendo.directives','pascalprecht.translate','tmh.dynamicLocale']); 

    app.config(['$routeProvider', '$httpProvider', '$translateProvider', 'tmhDynamicLocaleProvider', '$compileProvider', function($routeProvider, $httpProvider, $translateProvider, tmhDynamicLocaleProvider, $compileProvider) {
    'use strict';

    $compileProvider.debugInfoEnabled(false);

    $routeProvider.otherwise({
        redirectTo: '/login'
    });
    }]);

In myModule.js

  app.requires.push('app.myModule');

and in your index.html, include the app.js first and myModule.js next. By this way, you can include n number of modules without modifying the app.js.

Include the myModule.js on the fly from app.js

var mainHead = document.getElementsByTagName('HEAD').item(0);
var myScript= document.createElement("script");
myScript.type = "text/javascript";
mainHead.appendChild( myScript);
myScript.src='../myModule.js';
Source Link
tk120404
  • 3.1k
  • 1
  • 29
  • 28

We can achieve it by using app.requires

//app.js
 var app = angular.module('myngapp');
    app.requires.push('ngRoute', 'ngCookies', 'ui.bootstrap', 'pascalprecht.translate', 'tmh.dynamicLocale');
    app.config(['$routeProvider', '$httpProvider', '$translateProvider', 'tmhDynamicLocaleProvider', '$compileProvider', function($routeProvider, $httpProvider, $translateProvider, tmhDynamicLocaleProvider, $compileProvider) {
    'use strict';

    $compileProvider.debugInfoEnabled(false);

    $routeProvider.otherwise({
        redirectTo: '/login'
    });
  }]);

In myModule.js

  app.requires.push('app.myModule');

and in your index.html, include the app.js first and myModule.js next. By this way, you can include n number of modules without modifying the app.js.

Include the myModule.js on the fly from app.js

var mainHead = document.getElementsByTagName('HEAD').item(0);
var myScript= document.createElement("script");
myScript.type = "text/javascript";
mainHead.appendChild( myScript);
myScript.src='../myModule.js';