Question

如果我能为md-tab-group制作水平滚动条，我真的很有趣。我的意思不仅仅是一个箭头，而是添加一个水平滚动条？哪个会滚动组件？

<md-tab-group>
    <md-tab label="Item1"></md-tab>
    <md-tab label="Item2"></md-tab>
    <md-tab label="Item3"></md-tab>
    <md-tab label="Item4"></md-tab>
    <md-tab label="Item5"></md-tab>
</md-tab-group>

这是一个简单的例子，我想知道如何在这里实现滚动条？

Answer 1

首先，使用md-no-pagination指令删除箭头。第二步是覆盖md-tabs-canvas样式：

<md-tabs class="example" md-no-pagination>
  <md-tab ng-repeat="label in array" label="{{label}}">
    Tab {{$index}} content
  </md-tab>
</md-tabs>

.example md-tabs-canvas {
  overflow-x: scroll !important
}

以下是一个工作示例：https://codepen.io/anon/pen/qPWeXx

如何将垂直滚动添加到md-tab-group标记

1 个答案: