使用 ng-model 指令从 select2 中删除空选项答案

【问题标题】：Delete empty option from select2 with ng-model directive使用 ng-model 指令从 select2 中删除空选项
【发布时间】：2016-05-10 09:46:26
【问题描述】：

我的 select2 中有 2 个空选项：1 我添加到 html 以使占位符有效，1 我不知道它从哪里出现。

如何通过 jquery 删除空选项？困难在于我无法从 select 的下拉列表中获取 div 来检查 div 的 text() 是否为空，因为它也在 div 中。

空 div 示例：

<li class="select2-results-dept-0 select2-result select2-result-selectable select2-highlighted" role="presentation">
  <div class="select2-result-label" id="select2-result-label-12" role="option">
    <span class="select2-match"></span>
  </div>
</li>

填充div示例：

<li class="select2-results-dept-0 select2-result select2-result-selectable select2-highlighted" role="presentation">
  <div class="select2-result-label" id="select2-result-label-12" role="option">
    <span class="select2-match"></span>
    "Text1"
  </div>
</li>

这是演示我的问题的 pluner（在我的真实 html 中，我只有 1 个空选项）： http://plnkr.co/edit/pO71Wr0k9BM2D2Z5yQWu?p=preview

【问题讨论】：

标签： javascript jquery angularjs jquery-select2 select2

【解决方案1】：

使用filter() 函数仅选择空选项并使用remove() 删除它们

 $('select option:not(:first)')
        .filter(function() {
            return !this.value || $.trim(this.value).length == 0 || $.trim(this.text).length == 0;
        })
       .remove();

【讨论】：

如果我的空选项有值但没有文本，过滤器函数会是什么样子？
这将删除所有没有值或没有文本的选项元素。
您的回答部分帮助了我。但它不会删除我选择它们后出现的这些选项。所以这个 oprion 出现：或或也许是 select2 的问题？
嗯，我不明白你的意思，你能把它放在 plnkr 或 jsfiddle 中吗？我很困惑
我解决了我的问题。所以我需要使用 ng-options 添加选项。在我使用 .append() 之前。并且角度添加了空选项以显示我选择的选项的值。

【解决方案2】：

发生这种情况是因为在您的 options.js 脚本中添加了三个带有文本的新选项：“Text1、Text2、Text3”。如果您删除此代码，那么它将与您在 html 中的三个空选项一起使用。此外，如果您将空添加到选择空选项中，您将看到它们。如果选择这样填充数据，您将看到三个带有数据和占位符的选项：

    <select id="select", multiple="true">
      <option value="one">One</option>
      <option value="two">Two</option>
      <option value="three">Three</option>
    </select>

【讨论】：

kipris 那你想要什么？

【解决方案3】：

可以在Plnk.co... 上查看根据您的需要的工作演示

我不习惯 plnkr，所以如果您无法检查链接或文件，请告诉我，我会将文件发送给您。

我对你的js文件做了一些修改，希望对你有帮助。

【讨论】：