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]

回答

相關問題