Angular Bootstrap Ui-select

Question

我正在尝试在我的 angularjs 中使用 ui-select 指令，但它没有显示，我尝试按照文档进行操作，这就是我所做的：

 <ui-select ng-model="form.gender" theme="bootstrap">
    <ui-select-choices repeat="gender in genders">
        {{ gender.name }}
    </ui-select-choices>
</ui-select>

然后我有一组性别：

$scope.genders = [
    {
        name: 'Male'
    },
    {
        name: 'Female'
    }
];

我以前没有真正使用过这个指令，所以我对我做错了什么有点困惑。

我的浏览器控制台中没有显示任何错误，我也在我的应用程序中包含了该模块。

我想将它用于不仅仅是一个简单的性别下拉菜单，但我认为这是一个开始，如果我能做到这一点，那么我将不会再遇到任何问题。 :)

编辑： 所以我清除了浏览器缓存并刷新了我的页面，这次我确实注意到一个错误：

Error: [ui.select:transcluded] Expected 1 .ui-select-match but got '0'.

Answer 1

您必须访问此 link 并遵循其示例。

You can follow its examples

我个人比较喜欢用uiselect2，比uiselect更强大也更简单

link of uiselect2

Answer 2

Error: [ui.select:transcluded] Expected 1 .ui-select-match but got '0'.

此错误最近已在 Github 页面修复。只需将 ui-select 更新到 v0.14.3.

参考：https://github.com/angular-ui/ui-select/issues/224

Answer 3

只需添加一个 class 命名为标签。

 <ui-select ng-model="form.gender" theme="bootstrap">
    <ui-select-choices class="ui-select-choices" repeat="gender in genders">
        {{ gender.name }}
    </ui-select-choices>
</ui-select>

Answer 4

.ui-select-toggle > .caret { pointer-events: none } 解决了问题错误：[ui.select:transcluded] 预期 1 .ui-select-匹配但得到“0”。对我来说

Answer 5

正如@Caner Çakmak所说，我在ui-select-选择和ui-select-中添加了一个名为标签的class比赛

例如：

<ui-select ng-model="form.gender" theme="bootstrap">
    <ui-select-match class="ui-select-match" [etc...etc....etc]>
    <ui-select-choices class="ui-select-choices" repeat="gender in genders">
    {{ gender.name }}
    </ui-select-choices>
</ui-select>

而且成功了！谢谢

PS：我正在使用 ui-select v0.19.X 和 Angular v1.5.X（这似乎是发生此错误时）

Angular Bootstrap Ui-select

Angular Bootstrap Ui-select

twitter-bootstrap

angularjs

angular-ui-select