Angularjs Bootstrap Select 创建重复选择答案

【问题标题】：Angularjs Bootstrap Select Creates Duplicate SelectAngularjs Bootstrap Select 创建重复选择
【发布时间】：2020-06-12 08:05:57
【问题描述】：

所以我使用来自https://developer.snapappointments.com/bootstrap-select 的引导日期选择器，当我使用桌面浏览器时它工作正常。我也使用 AngularJS。

代码是：

<div class="form-group" ng-repeat="spec in specs">
    <label class="control-label">{{spec.SpecName}}</label>
    <select ng-change="getBuyPrice(false)" class="form-control selectpicker" 
            ng-model="selectedSpec[$index]" data-live-search="true">
        <option value="">-- Select {{spec.SpecName}} --</option>
        <option ng-repeat="value in spec.Values" value="{{value.ID}}">
          {{value.Value}}
        </option>
    </select>
</div>

它看起来可以在桌面浏览器上找到，并且按预期工作。没有发现它的错误。

但是当我使用手机浏览它时，它会在手机浏览器上显示重复的select picker。

规格（颜色）在移动浏览器上重复了两次，我尝试使用不同的浏览器但结果是一样的。我还尝试使用 chrome 调试器（在桌面上）并单击 toggle device toolbar 它在调试器上运行良好。

请帮忙

【问题讨论】：

可能与github.com/snapappointments/bootstrap-select/issues/1700相关

标签： javascript angularjs bootstrap-4 bootstrap-select bootstrap-selectpicker

【解决方案1】：

所以这是一个令人头疼的问题。我尝试使用 Chrome 远程调试工具检查我的手机。我发现：

$('select.selectpicker').selectpicker('refresh');

是导致问题的原因。我不知道为什么它在桌面上工作而不是在移动设备上工作。这仍然是一个谜。但是，将类名从 selectpicker 更改为其他名称可以解决问题。就我而言，我只是将其更改为selectsearch。

$('select.selectsearch').selectpicker('refresh');

希望对和我有同样问题的人有所帮助。

【讨论】：