md-tabs不显示滚动或分页

时间:2018-09-20 20:16:38

标签: angularjs angularjs-material

我最近将我的angularjs素材版本从1.0.9升级到了1.1.10。更改后,发生溢出时,滚动条已停止出现在选项卡菜单面板的侧面。以前可以正常工作。 现在,我仅在Devtools中看到以下内容,由于某种原因,该标志对于分页无法正常工作。请让我知道这里可能是什么问题。

<!-- ngIf: $mdTabsCtrl.shouldPaginate -->

这是我的代码。

<div class="mainContentWrapper md-whiteframe-2dp" id="mainContentWrapper" style="overflow:auto;">
            <div class="tab-panel">
                <md-content class="md-padding">
                    <md-tabs md-selected="selectedIndex" md-border-bottom md-autoselect>
                        <md-tab>
                            <img class="dashboard" width="20" src="../../images/dashboard-icon1.png" />
                            <md-tooltip md-direction="right" ng-click="backToDashboard()">
                                Dashboard
                            </md-tooltip>
                        </md-tab>
                        <md-tab ng-repeat="tab in tabs"
                                ng-disabled="tab.disabled"
                                title="{{tab.desc}}" ng-if="$index>0">
                            {{tab.title}}
                            <md-tooltip>
                                {{tab.desc}}
                            </md-tooltip>
                        </md-tab>
                    </md-tabs>
                </md-content>
            </div>

1 个答案:

答案 0 :(得分:0)

实施从1.0.9更改为1.1.10。在新版本中,它使用MutationObserver来检测任何更改以确定是否需要显示分页。

var mutationCallback = function() {
        ctrl.updatePagination();
        ctrl.updateInkBarStyles();
      };

      if('MutationObserver' in $window) {
        var config = {
          childList: true,
          subtree: true,
          // Per https://bugzilla.mozilla.org/show_bug.cgi?id=1138368, browsers will not fire
          // the childList mutation, once a <span> element's innerText changes.
          // The characterData of the <span> element will change.
          characterData: true
        };

        observer = new MutationObserver(mutationCallback);
        observer.observe(element[0], config);
        disconnect = observer.disconnect.bind(observer);
      } else {
        var debounced = $mdUtil.debounce(mutationCallback, 15, null, false);

        element.on('DOMSubtreeModified', debounced);
        disconnect = element.off.bind(element, 'DOMSubtreeModified', debounced);
      }

以前,它仅使用$ mdUtil.debounce(mutationCallback,100),这意味着它每100毫秒更新一次标志。由于某些原因,当我调整窗口大小时,不会触发突变。因此,在调整标签大小时,我不得不手动更改标签的内容。我不喜欢此修复程序。我想念什么吗?