angularjs – UI路由器不从URL进行正确的状态

发布时间：2020-12-17 08:05:54 所属栏目：安全来源：网络整理

导读：我有一个复杂的设置与许多嵌套的标签/视图。以下是我的$ stateProvider的相关部分 $stateProvider .state('tab',{ abstract: true,url: '',templateUrl: 'tabs.html' }) .state('tab.event',{ url: '/event',views: { 'event': { abstract: true,templateUr

我有一个复杂的设置与许多嵌套的标签/视图。
以下是我的$ stateProvider的相关部分

$stateProvider
    .state('tab',{
        abstract: true,url: '',templateUrl: 'tabs.html'
    })
    .state('tab.event',{
        url: '/event',views: {
            'event': {
                abstract: true,templateUrl: 'event-tabs.html'
            }
        }
    })
    .state('tab.event.list',{
        url: '/list',views: {
            'list': {
                templateUrl: 'event-list.html'
            }
        }
    })
    .state('tab.event.detail',{
        cache: false,url: '/:id',views: {
            'detail': {
                abstract: true,templateUrl: 'event-detail-tabs.html'
            }
        }
    })
    .state('tab.event.detail.info',url: '/info',views: {
            'info': {
                templateUrl: 'event-detail-info.html'
            }
        }
    })
    .state('tab.event.detail.map',url: '/map',views: {
            'map': {
                templateUrl: 'event-detail-map.html'
            }
        }
    });

>使用ui-sref =“tab.event.detail({id：event.id})”我可以链接到tab.event.detail.info状态，URL更改为/ event /：id / info，很好。
>如果我输入URL / event /：id，它将重定向到/ event /：id / info，很好。
>但是，如果我输入URL / event /：id / info，状态将更改为tab.event.list和URL到/ event / list，不好。

我想要分享到/ event /：id / info和/ event /：id / map的链接，但是它们仍然重定向到/ event / list
尝试了很多东西，但不能让它上班，请帮忙！

编辑：做一个Plunker的例子，但我无法复制的问题，因为我不能直接操纵的应用程序的URL。 https://plnkr.co/edit/7iZAH26SwAILqBfkdXJS?p=preview

在您定义了所有状态之后，您可以尝试使用它：

$urlRouterProvider
    .when('/event/:id/info','/event/:id/info')
    .when('/event/:id/map','/event/:id/map')

或者你可以试试

var config = ['$rootScope','$state',function ($rootScope,$state) {

  //you can make the below code better by comparing URL you are hitting in the if condition. Depending on URL you can navigate to info or map state. Also,you can make the id dynamic

  $rootScope.$on('$stateChangeStart',function (event,toState) {    
    if (toState.name == "tab.event.list") { 
      event.preventDefault()
      $state.go('tab.event.detail.info',{id: 2});
    }
  });

}]

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!