Angular app with modular html files

Question

I am writting an app from scratch in Angular with node.js and I was wondering if I am doing things correctly.

I want to split the content of my index into smaller html modules with their respective controllers, this way, everything will look more structured and easy to find when the project gets bigger.

For example :

index.html <--- main file
/views/menu.html <--- menu module
/views/content.html
/js/menu.js <---controller for the html module
/js/content.js ...

I can manage those files by just adding ng-include :

e.g

< ng-include src=" 'views/menu.html' ">

My concern is that this is like a GET request per file and I was wondering if this would affect the load speed of my application. Because I am working in local, this loads in 2ms which is very quick but I was wondering how this would behave online.

My questions are :

Is this the best way to create a modular app with different html files and js controllers ?
Is there a better way to achieve what I want to do ?

I am still learning Angular, sorry if this is too basic.

Thanks

Dhruv Raj Singh · Accepted Answer · 2015-08-04 11:17:26Z

3

Its better to use index.html as basic load file which will load all css and js on the load of the app,

for ex:- you can make diffrent app for login and after login section. After login. load all the js and css files through the app after login..it will improve the loading time and also be a modular

answered Aug 4, 2015 at 11:17

Dhruv Raj Singh

3222 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ashwani Kumar · Accepted Answer · 2017-02-08 09:25:56Z

2

as suggested by @Dhruv Raj Singh It is good to use a different ng-app for pre-login and post-login. It is always good to structure the code that you want.

Now ng-include will Emitted event $includeContentRequested every time the ngInclude content is requested.

Now it up to the requirement use cases how to use and when to use.

If the module is a sperate and special one which requires lots of resources specific to it only and will be used by few users and only few times then it is better to include them for that module only

else common resources should be included at ng-app level.

You can name and organised the resources whatever way you want but include them at post-login app creation.

answered Feb 8, 2017 at 9:25

Ashwani Kumar

6633 gold badges6 silver badges18 bronze badges

Collectives™ on Stack Overflow

Angular app with modular html files

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related