form component data from the web-api on every page

Question

I have various page in my project and each page contain lots of drop down.

For getting options of drop-down from web-api and then i store this variable in angular service variable for further use in another view.

But i didn't get the way where should i call web-api to get drop-down data so that it doesn't matter which page should i open first or by default???

And i get options of drop-down every where.Currently i calling web-api in the controller which is correspond to my first view of application.

My approaches regarding this: Method 1: I create a root controller in which i call angular service which call web-api to get data. The view is already render on view-port before get the the from web-api.

Method 2: i call angular service which call web-api in controller(not root controller which to specific to a view) and populate data in drop-down after successful callback from service so this working fine but it's not generic

Answer 1

Services/Factory are singleton, so I believe you should call the web api in your service rather than in controller and then passing the data to service.

EDIT -

If you are concern about the display of view before the data then you can use resolve as resolve can wait for data to become available before showing a view.