1

I am trying to display menu and sub-menu using ui.bootstrap from angular.js but while selecting submenu the respective parent menu is not getting active class.

dashboard.html: 

<li ng-class="{'active open': $state.includes('dashboard.settings.area')}"><a ui-sref="dashboard.settings.area.manageState">Settings</a></li>

This is my top parent menu means while click on settings parent menu the below sub-menu will open.

settings.html:

<div>
<uib-tabset> 

<uib-tab ui-sref="dashboard.settings.area" active="set[1]"> 
<uib-tab-heading>Manage Area</uib-tab-heading>
</uib-tab> 

</uib-tabset> 
<div ui-view></div>
</div>

settingscontroller.js:

var dept=angular.module('easyride');
dept.controller('settingsController',function($scope,$state){
    $scope.set = {
    1: ($state.current.name === 'dashboard.settings.area')
    };
});

Then under this sub-menu there is two more sub-sub-menu present which are given below.

area.html:

<div>
<uib-tabset> 

<uib-tab ui-sref="dashboard.settings.area.manageState" active="area[1]"> 
<uib-tab-heading>Manage State</uib-tab-heading> 
</uib-tab> 

<uib-tab ui-sref="dashboard.settings.area.manageCity" active="area[2]"> 
<uib-tab-heading>Manage City</uib-tab-heading> 
</uib-tab>

</uib-tabset> 
<div ui-view></div>
</div>

areacontroller.js:

var dept=angular.module('easyride');
dept.controller('areaController',function($scope,$state){
    $scope.area = {
    1: ($state.current.name === 'dashboard.settings.area.manageState'),
    2: ($state.current.name === 'dashboard.settings.area.manageCity')
    };
});

When user will click on settings parent menu it will open the sub-menu->Manage Area and under this sub-menu the sub-sub-menu->Manage State will open and total chain will remain active. Means settings,Manage Area,Manage State three tab will remain active but in my case only Manage State remains active but its parent menu is not highlighting so here I need to put the multiple conditions in uib-tab active class.

halfer
  • 19,824
  • 17
  • 99
  • 186
satya
  • 3,508
  • 11
  • 50
  • 130
  • This is a bit less chatty than your prior questions, thank you. As an aside, I have removed the quote formatting from your filenames - remember that quote formatting has a special meaning, which is that the material has been "quoted" from elsewhere. So that's speeches, manuals, book excerpts, error messages, etc - but not ordinary text. Thanks! – halfer Jan 23 '18 at 10:15

0 Answers0