CODEWITHSUNDEEP
asp.net-mvcangularjs
uriDium
uriDium

Reputation: 13420

Can you dynamically load modules in Angular?

I have an angular app with two distinct sections to it. Each section belongs to a type of user. There are some commonalities but for the most part rather different. For example:

/receptionist
    - View Diary
    - Answer Phone
    - Make Tea 
/ceo
    - View Diary
    - Announce Earnings
    - Strategize

Both the ceo and the receptionist need the functionality for viewing the diary. I was thinking wanting to change the modules loaded (and the routing) depending on who logged in.

if (user.type === 'receptionist') {
    app = angular.module('receptionistApp', ['diary', 'phone', 'tea']);
else {
    app = angular.module('ceoApp', ['diary', 'earning', 'strategy']);
}

I am wanting to do this because there is some overlap, but not a lot. And each app is actually quite big.

I am not wanting to achieve anything security wise here. Each app will have different types of users and roles. Those will be secured through WebApi. I just wanting to avoid loading all of the modules when 45% of them will be of no interest to the other app.

Upvotes: 2

Views: 374

Answers (1)

Philipp Gayret
Philipp Gayret

Reputation: 5070

Yes.

Also, (and you probably won't need this) you can load modules even more dynamically, and initialize AngularJS yourself instead of having it load instantly. You can remove the ng-app directive, and do a manual initialization.

angular.element(document).ready(function() {
    angular.module('myApp', []);
    angular.bootstrap(document, ['myApp']);
});

Upvotes: 2

Related Questions