Question

我正在尝试使用Angular Material在AngularJS中实现制表符。

我有一些标签。单击选项卡时，应显示特定于该选项卡的内容。但我面临的问题是，该标签的内容并不占用整个设备长度。

<md-tabs md-selected="selectedIndex">
    <md-tab md-on-select="onTabSelected(tab)" md-on-deselect="announceDeselected(tab)" ng-disabled="tab.disabled">
        <md-tab-label>
            <p>Tab A</p>
        </md-tab-label>
        <md-tab-body>
            <p>Content of tab A</p>
            <div infinite-scroll="loadMore(tab.id)" infinite-scroll-disabled="busy">
                <div ng-repeat="p in products">
                    <div class="well">
                        <h3>{{p.id}}</h3>
                        <h5>{{p.cat_id}}</h5>
                    </div>
                </div>

                <div ng-show="busy">Loading more products....</div>

            </div>
        </md-tab-body>
    </md-tab>
</md-tabs>

＆＃34; MD-制表体＆＃34;指令指定选项卡内容。

在上面的代码中，我只想实现ng-Infinite滚动作为选项卡内容的一部分。但不知何故，标签内容只占页面长度的一部分。是否有任何解决方案可以使标签内容占据页面的全长。

Answer 1

我不确定此问题是否还有其他解决方案，但最简单的方法是在md-tabs指令上使用md-dynamic-height属性。

<md-tabs md-dynamic-height>
.....
</md-tabs>

这就是你需要的一切！

为什么md-tab-body没有跨越屏幕的全长

1 个答案: