Juan Biscaia
Juan Biscaia

Reputation: 245

Individual css files for each template or view in states, ui-router

this is a noob question, I've started using the ui-router about 2 days ago and still looking for the best solution in this one...

My system have two separated layouts for dashboard page and login page, and unfortunately have css that conflicts if used all in the same page... This means that I can't use two ui-views inside the body tag and put all my css inside the head tag.

I've tried to separate them using the ui-view naming feature or putting one ui-view inside head tag (I know, but I was trying everything), but this didn't worked well.

The two named ui-views worked nice, but the problem is the css loading time and priority, because if I load the css files inside the body the browser can load the site broken for the lack of some css properties.

I searched for one solution in google/stackoverflow but I've found nothing, just a guy who have made an module to load state separated css inside the "data" node, but again, i've the load time and priority problem.

I know that this can be a noob question and I'm aware of that, but I've learned that in this line of work (development, you know) that if you have a problem you are not alone in the world, and someone, in some place have figured out how to solve the problem.

Upvotes: 2

Views: 1023

Answers (1)

user456584
user456584

Reputation: 88815

Check out the following package: https://github.com/manuelmazzuola/angular-ui-router-styles

Upvotes: 1

Related Questions