raj
raj

Reputation: 694

change ng include or define default ui view

I have an angular webapp and I want a header for home page and different one for all other pages. My present html structure is

<html>
<body>
<ng-include="header.html">
<div data-ng-include="'header.html'"></div>
<section data-ui-view></section>
<div data-ng-include="'footer.html'"></div>
</body>
</html>

i want to include header-home.html when the page is home page. i tried writing the path of include in headerController and assign appropriate value depending on $location.path(). but it will run only once when page loads. when ui-view changes it wont run. I know i can assign different views in a state using ui-view but i have many routes and need to change a lot of config files if i wanna add a new view for header in all views.

Is there any way i can include the appropriate header from app.run so that it will change according to route or run the header controller every time a route changes or assign a default view to a state if not specified.?

Upvotes: 0

Views: 679

Answers (1)

mohamedrias
mohamedrias

Reputation: 18566

In app.run listen for state change event and based on the state change set a flag in $rootScope.

In your HTML:

Based on the flag use ng-if and include different header templates.

Upvotes: 1

Related Questions