如何设置 ui-select 的大小？答案

【问题标题】：How to set size of ui-select?如何设置 ui-select 的大小？
【发布时间】：2015-11-16 22:43:38
【问题描述】：

我正在使用带有引导程序的 ui-select。众所周知，bootstrap 有 input-lg, input-sm... 但是有没有什么好办法可以改变 ui-select 的大小呢？

【问题讨论】：

每个帖子只有 1 个问题

【解决方案1】：

我的回答可能晚了 6 年，但为了所有将来会遇到这个问题的人，对我有用的修复是使用内联 css 来设置 ui-select 的高度

 <ui-select theme="bootstrap" style="min-height:34px" ng-model="model">
  <ui-select-match placeholder="Placeholder"></ui-select-match>
  <ui-select-choices refresh-delay="0" repeat="item in roleList">
    <div>{{item.name}}</div>
  </ui-select-choices>
</ui-select>

【讨论】：

【解决方案2】：

你能告诉你什么是“好方法”吗？如果 CSS 足够好，那么您可以使用它为元素设置样式，看起来像这样。

.form-input-sm .ui-select-toggle {height: 40px}

这是简单的 HTML：

<ui-select theme="bootstrap" ng-model="model">
  <ui-select-match placeholder="Placeholder"></ui-select-match>
  <ui-select-choices refresh-delay="0" repeat="item in roleList">
    <div>{{item.name}}</div>
  </ui-select-choices>
</ui-select>

而且我不是魔术师，我不知道选择器只是在这里查看 HTML。如果你需要找到合适的选择器，你可以使用浏览器开发者工具。例如，相同的技术用于覆盖 Bootstrap 中的所有默认样式。

【讨论】：

改变高度还不够
这里你正在改变所有 ui-select 控件的高度。我认为关键是如何为 ui-select 指定一个 css 类以更改它的大小，如果您想将特定的 ui-select 项目调整为自定义大小。
顺便说一下@Georgy，你不是魔术师，你只是硬编码样式......我认为必须有另一种方法来做同样的事情，只用一些内置的 Bootstrap 类/es来装饰html。当@xlhuang 说“有一个好方法”时，这就是问题的重点。