On the main page, I have the following code snippet for navigation:
<li ng-class="{ active: hello.isActive('/page1')}"><a ui-sref="root.content({store:hello.store_selected,product:hello.product_selected})" >page1</a></li>
<li ng-class="{ active: hello.isActive('/page2')}"><a ui-sref="root.turnover({store:hello.store_selected,product:hello.product_selected})">page2</a></li>
There are two controllers for each route: Page1Controller and Page2Controller. The main page, where this code is located, also has a controller named HelloController. In the helloController, I have defined the following function:
vm.isActive = function(viewLocation) {
return viewLocation === $location.path();
};
When clicking on an item, it gets highlighted as expected. However, there are two issues: 1. Clicking anywhere else on the page removes the highlight from the current item. 2. At the start of the page or upon refreshing, no item is highlighted by default. Could you please provide some assistance? Thank you.