Angular Ui路由器在访问URL时没有加载视图[material-ui + tabs]

我使用的是Angular + material-ui，基本上我想用不同的步骤做一个入门过程，所以我使用tabs指令，每个都带有不同的ui-view。Angular Ui路由器在访问URL时没有加载视图[material-ui + tabs]

HTML：

<div ng-controller="TabsCtrl" class="content" ng-show="$root.loadingComplete"> 
    <md-tabs md-selected="$root.selectedIndex" md-border-bottom class="md-primary"> 
     <md-tab id="tab1" md-on-select="goTo('start')"> 
      <md-tab-label>Welcome</md-tab-label> 
      <md-tab-template> 
       <md-content> 
        <div ui-view="vStart"></div> 
       </md-content> 
      </md-tab-template> 
     </md-tab> 
     <md-tab id="tab2" md-on-select="goTo('personal')"> 
      <md-tab-label>Personal</md-tab-label> 
      <md-tab-template> 
       <md-content> 
        <div ui-view="vPersonal"></div> 
       </md-content> 
      </md-tab-template> 
     </md-tab>

这是我的路由配置：

angular.module('onboarding').config(['$stateProvider', '$urlRouterProvider', 
    function($stateProvider, $urlRouterProvider) { 
     $stateProvider 
      .state('start', { 
       url: '/:memberId', 
       views: { 
        vStart: { 
         templateUrl: 'views/start.html', 
         controller: 'StartCtrl' 
        } 
       } 
      }) 
      .state('personal', { 
       url: '/:memberId/personal', 
       views: { 
        vPersonal: { 
         templateUrl: 'views/personal.html', 
         controller: 'PersonalCtrl' 
        } 
       } 
      }) 
      ...

函数GOTO（状态）：

$scope.goTo = function(state) { 
      $state.transitionTo(state, $stateParams); 
     };

的问题主要是，如果我打开“家“在url localhost:9000/#/12345它工作正常，我看到了开始的观点，我可以切换到个人观点与

$rootScope.selectedIndex = 1; 
$state.transitionTo('personal', $stateParams);

但是，如果我直接打开网址从localhost:9000/#/12345/personal什么也没发生，视图不会加载，并且还没有加载控制器。我有一个console.log('start controller')和相同的console.log('personal controller')来检查它们何时加载。

另外，浏览器历史记录不能正常工作，比如我去locahost:9000/#/12345起始页面，然后点击按钮即可进入localhost:9000/#/12345/personal一切都很好，但这时如果我回去跟浏览器历史记录的网址是localhost:9000/#/1245（正确），但视图完全是空的，并且根本没有加载控制器。

来源

2015-03-31 mtt

任何机会，你可以设置一个Plunkr或CodePen重现这个问题。我目前使用UI路由器与MD - 标签，它似乎工作正常。 – 2015-05-14 19:08:18

我放弃了某些时候，改变了代码，也许这只是我使用的版本（如果我没有记错的话）（0.8.3）有问题。我会在下周试下最新版本:) – mtt 2015-05-15 09:31:30

不要放弃！ :)我已经尝试过相同的版本。让我们知道怎么回事。 – 2015-05-15 11:14:05

看起来你的路由是关闭的。 UI路由器将子状态的url附加到其父状态。

尝试删除标题/:memberId：

.state('personal', { 
    url: '/personal', 
     views: { 
      vPersonal: { 
       templateUrl: 'views/personal.html', 
       controller: 'PersonalCtrl' 
      } 
     } 
})

来源

2015-05-26 16:00:02 JanS

Angular Ui路由器在访问URL时没有加载视图[material-ui + tabs]

回答

相关问题