Question

我是Angularjs Material的新手，所以也许这是显而易见的事情，但似乎我无法理解。

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

我之前发现了一个非常相似的问题：

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

然而，它似乎对“尺寸”和“ng-size”都没有任何影响

这是我的例子：

<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>

Answer 1

查看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个。这个数字不一定适合你，所以要玩高度直到你满意为止。

希望有所帮助。

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

1 个答案: