有角度的材料 - 从底部开始的侧面?

时间:2017-02-15 11:10:17

标签: javascript html angularjs angular-material sidebar

Angular material sidenav似乎有左/右选项

  • <md-sidenav class="md-sidenav-**right**">
  • <md-sidenav class="md-sidenav-**left**">

虽然它被称为" side" -nav,可以将它用作" bottom" -nav?

如果可以的话怎么办?

3 个答案:

答案 0 :(得分:3)

如您所说,没有底部导航,但您可以使用https://material.angularjs.org/latest/demo/bottomSheet

进行操作

查看

<div class="bottom-sheet-demo inset" layout="row" layout-sm="column" layout-align="center" >
    <md-button flex="50" class="md-primary md-raised" ng-click="showBottomSheet()">Show</md-button>
  </div>

<强> JS

$scope.showBottomSheet = function() {
    $scope.alert = '';
    $mdBottomSheet.show({
      templateUrl: 'bottom-sheet-template.html',
      controller: 'BottomSheetCtrl'
    }).then(function(clickedItem) {
      $scope.alert = clickedItem['name'] + ' clicked!';
    });
  };

答案 1 :(得分:0)

角度材质不支持底部导航..您必须手动实现。

答案 2 :(得分:0)

我认为您要实现的目标可以通过覆盖角度材料样式来满足您的需求。只需将一些自定义类或ID添加到<md-sidenav>元素并应用您的样式。