Angular UI-router父狀態未激活

Question

嗨我遇到一個問題，當孩子打電話時父母狀態不活躍。

我正在使用帶有ui-sref-active功能的ui-router。

這是我的路由器代碼：

.state('customers', {
    abstract: true,
    parent: 'app',
    url: '/customers',
    templateUrl: 'app/customer/parent.html',
})
.state('customers.list', {
    parent: 'customers',
    url: '',
    controller: 'customerCtrl as customer',
    templateUrl: 'app/customer/index.html'
})

.state('customers.birthday', {
    parent: 'customers',
    url: '/birthday',
    templateUrl: 'app/customer/birthday.html',
})

這是我的HTML：

 <ul id="menu-sidebar">
    <li class="has_sub">
        <a ui-sref="customers.list" class="waves-effect" ui-sref-active="subdrop">
            <i class="fa fa-users"></i> <span> Customers</span>
        </a>
    </li>
</ul>

我正在使用ng-repeat，因為有足夠的菜單。

問題是當我調用/customers ， ui-sref-active正常工作。 但是當/customers/birthday call，ui-sref-active消失了。

以下截圖：

任何建議如何使其工作？

提前致謝！

Answer 1

可能是因為你的築巢路線。 嘗試這樣的事情：

.config(function($stateProvider, $urlRouterProvider, $ionicConfigProvider) {
$stateProvider
.state('exampleState', {
    url: '/example',
    abstract: true,
    templateUrl: 'templates/example/root-view.html',
    controller: 'ParentCtrl'
  })

  .state('exampleState.games', {
    url: '/games',
    views: {
      'stats-games':{
        templateUrl: 'templates/example/firstpage.html',
        controller: 'PageOneCtrl'
      }
    }
  })
  .state('exampleState.sesaons', {
    url: '/seasons',
    views: {
      'stats-games':{
      templateUrl: 'templates/example/secondpage.html',
      controller: 'PageTwoCtrl'
    }
  })
});

Answer 2

    .state('home', {
        url: '/home',
        abstract: true,
        templateUrl: 'templates/home.html'



    })
    .state('home.main', {
        url: '',
        templateUrl: 'templates/main.html'



    })
    .state('home.owner', {
        url: '/owner',
        templateUrl: 'templates/owner.html'

    })

Answer 3

我終於解決了。

在我

    app.run(['$rootScope', '$state', function($rootScope, $state) {
    $rootScope.$on('$stateChangeStart', function(evt, to, params) {
      if (to.redirectToChild) {
        evt.preventDefault();
        $state.go(to.redirectToChild.state, params)
      }
    });
}]);

 app.config([ '$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.otherwise("/404");
    .state('customers', {
        url: '/customers',
        templateUrl: 'app/customer/parent.html',
        redirectToChild: {
                state: 'customers.list'
            },
    })
    .state('customers.list', {
        parent: 'customers',
        url: '',
        controller: 'customerCtrl as customer',
        templateUrl: 'app/customer/index.html'
    })

    .state('customers.birthday', {
        parent: 'customers',
        url: '/birthday',
        templateUrl: 'app/customer/birthday.html',
    })
}]);