调整下拉菜单高度以显示更多选项(AngularJS材质)

问题描述 投票:0回答:1

我是Angularjs Material的新手,所以也许这是显而易见的事情,但似乎我无法弄明白。

我有一个多选下拉菜单,在最初点击时只显示4个选项,其余的可以通过向下滚动查看/访问。我正在尝试将该视图扩展为另一个静态数字(例如,在没有滚动的情况下适合8个选项)。

我之前发现了非常相似的问题:

Make multiple-select to adjust its height to fit options without scroll bar

然而,似乎对“尺寸”和“ng尺寸”都没有任何影响

这是我的例子:

<md-input-container>
    <label>Providers</label>
    <md-select ng-size="10" ng-model="vm.selectedProviders" ng-change="vm.prov()" multiple>
        <md-optgroup label="Providers">
            <md-option ng-value="provider.namep" ng-repeat="provider in vm.providers">{{provider.namep}}</md-option>
        </md-optgroup>
    </md-select>
</md-input-container>
javascript html css angularjs angularjs-material
1个回答
0
投票

查看md-select的文档,似乎没有一个属性指定要显示的选项数。

因此,另一种可能的方法是更改​​AngularJS Material中默认设置的最大高度。它们的设置如下:

md-select-menu, md-select-menu md-content {
    max-height: 256px;
}

对我来说,它默认显示5个选项(不是4个)。所以,我把它添加到我的CSS:

md-select-menu, md-select-menu md-content {
    max-height: 385px;
}

并且它使所有md-select标签适合8个选项而不是5.数字对于你来说不一定相同,所以玩高度直到你满意为止。

希望有所帮助。

© www.soinside.com 2019 - 2024. All rights reserved.