select2.js 在 ngRepeat AngularJS 中不起作用答案

【问题标题】：select2.js is not working in ngRepeat AngularJSselect2.js 在 ngRepeat AngularJS 中不起作用
【发布时间】：2023-04-02 12:13:01
【问题描述】：

我正在使用 AngularJS 1.2.12，select2.js。我有用户表，每个用户都有一些国家，对于这个国家，我正在使用 select2。但它不起作用，它呈现为普通文本框。

    <script type="text/javascript">
<script src="static/js/angular.min.js"></script>
<script src="static/js/jquery.min.js"></script>
<script src="static/js/bootstrap.min.js"></script>
<script src="static/js/star-rating.min.js"></script>
<script src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"></script>
<script src="static/js/select2.js"></script>
<script src="static/js/admin.js"></script>
<script src="static/js/dirPagination.js"></script>
    </script>
    <table class="table table-striped table-bordered table-hover" id="demo">
            <thead>
              <tr>
                <th width="4%">Sl.No</th>
                <th>Name</th>
                <th width="30%" >Country</th>   
              </tr>
            </thead>
            <tbody>
              <tr ng-repeat="x in userObj">
                <td>{{$index+1}}</td>
                <td>{{x.username}}</td>
                  <td>
                  <div class="form-group m0b">
                    <select id="source">
                    <option>india</option>
                    <option>US</option>
                    </select>
           <select multiple name="e9" id="e9" class="populate"></select>
                  </div></td>
                <td><button type="button" class="btn btn-sm btn-toggle active" data-toggle="button" aria-pressed="true" autocomplete="on">
    <div class="handle"></div>
 </button></td>
                <td>
                    <button type="button" class="btn btn-default btn-xs edit" data-toggle="modal" title="Update"
                                                    data-target="#recruiters" data-backdrop="static"
                                                    data-keyboard="false"
                                                    ng-click="editRoleBtn(x.username,x.Selected,x.Selected_Admin)">
                                                <i class="fa fa-pencil-square-o" aria-hidden="true"></i>
                                                </button>
                  <button type="button" class="btn btn-danger btn-xs del" ng-click="deleteUser(x.username)" data-toggle="modal" data-target="#deleteUser" data-backdrop="static" data-keyboard="false"><i class="fa fa-remove"></i></button></td>
              </tr>
            </tbody>
          </table>

在国内 td 我想选择 select2 但它不起作用

【问题讨论】：

请张贴所有的相关代码。
你能说出你的 angular 和 select2.js 版本吗？
select2 版本是 3.5.3 angularjs 是 1.2.12
ng-app 模块在哪里？controller 在哪里？，你添加了select2 模块吗？请查看https://github.com/angular-ui/ui-select2
我也将 ng-app 和控制器添加到 body 标签中。我检查了 select2 是否在 ng-repeat 之外工作

标签： angularjs twitter-bootstrap jquery-select2 angularjs-select2

【解决方案1】：

将指令应用于表单元素：

<select ui-select2 ng-model="select2" data-placeholder="Pick a number">
    <option value=""></option>
    <option value="one">First</option>
    <option value="two">Second</option>
    <option value="three">Third</option>
</select>

ui-select2 指令可以很好地与 ng-model 和验证指令（例如 ng-required）配合使用。

如果您将ng-model 指令添加到与ui-select2 相同的元素，则选择的选项会自动与模型值同步。

【讨论】：