【问题标题】:Angular ui-select not displayingAngular ui-select 不显示
【发布时间】:2017-03-15 22:28:54
【问题描述】:

我想使用 ui-select,但它没有显示任何内容,开发者控制台中也没有错误。我已经在谷歌上搜索了几个小时,我已经尝试了我找到的所有建议,但没有任何帮助。

我使用 Chrome,并且在我的 SPA 项目中包含了 Bootstrap 版本 3.3.4 和 Angular 版本 1.4.8。我还包含了最新版本的 select.min.css 和 select.min.js。我在 Visual Studio 2015 中通过 NuGet 将 ui-select(版本 0.19.5)添加到我的项目中。

在尝试隔离问题时,我已将代码简化为一个非常简单的示例。这是我现在所拥有的(在我看来):

<div id="damageType" name="damageType" class="col-md-4">
    <ui-select ng-maxlength="10">

        <ui-select-choices repeat="f in ['light','hpexp']">
            {{ f }}
        </ui-select-choices>
    </ui-select>
</div>

我试过像这样添加一个 ng-hide,但无济于事:

<div id="damageType" name="damageType" class="col-md-4">
    <ui-select ng-maxlength="10">

        <ui-select-choices repeat="f in ['light','hpexp']" ng-hide="!$select.open">
            {{ f }}
        </ui-select-choices>
    </ui-select>
</div>

这是它在页面中的样子。应该显示下拉列表的 div 在那里,但它的高度是 1。另外,如您所见,控制台中没有错误:

这可能是什么问题?

【问题讨论】:

    标签: javascript angularjs twitter-bootstrap ui-select


    【解决方案1】:

    您好,我认为您缺少两件事。

    1. ui-select 需要一个 ngModel 所以定义这个ng-model='selectedvalue'
    2. 其次,我认为它需要ui-select-match,因为这是嵌入所必需的

    下面的代码应该可以工作:

    <ui-select ng-model="ctrl.selected">
     <ui-select-match placeholder="Enter an thing...">{{$select.selected}}</ui-select-match>
     <ui-select-choices repeat="item in ['1','2']">
      <span>{{item}}</span>
    </ui-select-choices>
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-10-05
      相关资源
      最近更新 更多