請與角料設計TABS

Question

angularJS UI路由器工作的TabControl的是可見的，當應用程序啓動，但...

當我點擊選項卡上沒有內容可見

什麼我錯了嗎？

我用的是最新的angularJS材料設計0.9.4。

$urlRouterProvider.otherwise(""); 
     $stateProvider 

      .state("main", 
      { 
      abtract: true, 
      url: '', 
      views: { 
       'content@': { 
       templateUrl: '../app/views/administration/administration.html', 
       controller: 'AdministrationController' 
       } 
      } 
      }) 
      .state('main.settings', { 
      url: '/settings', 
      views: { 
       'settings@main': { 
       templateUrl: "../app/views/administration/settings.html", 
       controller: 'GlobalConfigurationController' 
       } 
      } 
      }) 
      .state('main.schoolyears', { 
      url: '/schoolyears', 
      views: { 
       'schoolyears@main': { 
       templateUrl: "../app/views/schoolyear/schoolyears.html", 
       controller: 'SchoolyearsController' 
       } 
      } 
      }); 

HTML

<div layout-fill layout="column"> 
    <div ng-include="'app/components/navbar/navbar.html'"></div> 
    <div id="content" layout="column" layout-padding> 

    <md-tabs md-stretch-tabs="always" class="md-primary md-hue-2"> 

     <md-tab label="Schoolyears" ui-sref="main.schoolyears" md-active="$state.is('main.schoolyears')"> 
     <md-tab-body ui-view="schoolyears" layout="vertical" layout-fill></md-tab-body> 
     </md-tab> 

     <md-tab label="settings" ui-sref="main.settings" md-active="$state.is('main.settings')"> 
     <md-tab-body ui-view="settings" layout="vertical" layout-fill></md-tab-body> 
     </md-tab> 

    </md-tabs> 
    </div> 
</div> 

Answer 1

更新：利用ui-sref和md-tabs固定在角材質0.10.0

一種解決方法已經公佈在github ，在previous known md-tab issue ：

有一個plunker與解決方法（它似乎沒有工作的意見）：

$stateProvider 
     .state('tabs', { 
     abstract: true, 
     url: '/tabs', 
     templateUrl: 'tabs.html', 
     onEnter: function() { console.log("enter tabs.html"); } }) 

     .state('tabs.tab1', { 
     url: '/tab1', 
     onEnter: function() { console.log("enter tab1.html"); }, 
     controller: function($scope) { 

     }, 
     templateUrl: 'tab1.html' 
     }) 
     .state('tabs.tab2', { 
     url: '/tab2', 
     onEnter: function() { console.log("enter tab2"); }, 
     controller: function($scope) { 

     }, 
     templateUrl: 'tab2.html' 
     });