"Previous"/"Next"タブナビゲーションシステム（AngularJS/AngularJS Material）

Question

Angular.js 1.5.xとAngularJS Material 1.1.0を使用して、いくつかのコンテンツ表示をさまざまなタブで開発しています。

私はまず、のような角度の材料md-tabsシステムを使いました。

残念ながら、私たちのユーザーは、タブではないように見えるので、それらを使用しません。私はこの「次/前」ベースのタブナビゲーションシステムを作成するために、任意の角度材料の道を発見していない

：私は今、新たな、より明白に、タブのシステムに取り組んでいます。 私はどこに見えるか知っていますか？角度のある材料である必要はありません。ヘルプやリードは歓迎です。可能であれば、複雑さやカスタムコードを避けたいので、既存のフレームワークを活用したいと思います。

Answer 1

mdTabsは引き続き使用できます。選択したタブを次のように変更して、カスタムボタンを作成してタブにコマンドを出すことができます。md-selected

次に、md-noページネーションでタブナビゲーションを非表示にするか、display：noneに.md-tabを追加します。 CSS。

<div> 
    <md-tabs md-selected="tabIndex"> 
     <md-tab label="tab1"> 
     tab1 content 
     </md-tab> 
     <md-tab label="tab2"> 
     tab 2 content 
     </md-tab> 
     <md-tab label="tab3"> 
     tab 3 content 
     </md-tab> 
    </md-tabs> 
    <md-button ng-click="back()" class="md-raised"> 
     Previous 
    </md-button> 
    <md-button ng-click="next()" class="md-raised"> 
     Next 
    </md-button> 
</div> 

とコントローラ：

$scope.back = function() { 
    if ($scope.tabIndex > 0) { 
     $scope.tabIndex--; 
    } 
    }; 
    $scope.next = function() { 
    if ($scope.tabIndex < 2) { 
     $scope.tabIndex++; 
    } 
    } 

plunkr：http://plnkr.co/edit/NWSRBb?p=preview