md-tabs没有显示分页

时间:2015-07-03 22:40:25

标签: javascript angular-material

如果屏幕尺寸较小,Angular Material不会显示分页按钮。

鉴于example code并使用我的本地编辑器

进行了尝试
<div ng-controller="AppCtrl" class="sample tabsdemoDynamicTabs" layout="column" ng-app="MyApp">
  <md-content class="md-padding">
    <md-tabs md-selected="selectedIndex" md-border-bottom="" md-autoselect="">
      <md-tab ng-repeat="tab in tabs" ng-disabled="tab.disabled" label="{{tab.title}}">
        <div class="demo-tab tab{{$index%4}}" style="padding: 25px; text-align: center;">
          <div ng-bind="tab.content"></div>
          <br>
          <md-button class="md-primary md-raised" ng-click="removeTab( tab )" ng-disabled="tabs.length &lt;= 1">Remove Tab</md-button>
        </div>
      </md-tab>
    </md-tabs>
  </md-content>

  <form ng-submit="addTab(tTitle,tContent)" layout="column" class="md-padding" style="padding-top: 0;">
    <div layout="row" layout-sm="column">
      <div flex="" style="position: relative;">
        <h2 class="md-subhead" style="position: absolute; bottom: 0; left: 0; margin: 0; font-weight: 500; text-transform: uppercase; line-height: 35px; white-space: nowrap;">Add a new Tab:</h2>
      </div>
      <md-input-container>
        <label for="label">Label</label>
        <input type="text" id="label" ng-model="tTitle">
      </md-input-container>
      <md-input-container>
        <label for="content">Content</label>
        <input type="text" id="content" ng-model="tContent">
      </md-input-container>
      <md-button class="add-tab md-primary md-raised" ng-disabled="!tTitle || !tContent" type="submit" style="margin-right: 0;">Add Tab</md-button>
    </div>
  </form>

</div>

当我尝试调整屏幕大小不再适合文本时,分页器不显示。我正在使用最新的AngularMaterial版本0.10.0。

我错过了什么错误吗?

1 个答案:

答案 0 :(得分:0)

如果添加md-no-pagination = false;一切都取决于您拥有的Angular材料的版本