angularjs select2 所选值未显示在字段中答案

【问题标题】：angularjs select2 selected value is not shown in the fieldangularjs select2 所选值未显示在字段中
【发布时间】：2015-04-13 09:59:42
【问题描述】：

我正在使用带有 select2 插件的 angularjs。

当我编辑具有可以从下拉列表设置它的属性的项目时，当前选定的值在下拉列表中被选中/突出显示，但不可见。我必须实际单击下拉菜单才能看到实际选择的选项。基本上一开始这个字段是空的......

像这样：

您可以看到该字段为空，但如果您单击它，您会看到亚利桑那州已被选中。如何在无需点击的情况下直接在下拉列表中显示亚利桑那州？

这就是我将它绑定到元素的方式。

  <select data-custom-select class="form-control" data-ng-model="newType.Type" data-ng-options="t for t in definitions.Types"></select>

data-custom-select 是一个指令，允许我在元素上应用select2()：

 directive('customSelect', [function () {
    var link = function (scope, element, attrs) {
        element.select2();
    };

    return {
        restrict: 'A',
        link: link
    };
}])

型号：

$scope.newType = {
    Type: 'Type 1'
}

$scope.definitions ={
    "Definitions": [{
        "Id": "1",
        "Name": "Name 1"        
    }, {
       "Id": "2",
        "Name": "Name 2" 
    }],
    "Types": ["Type 1", "Type 2", "Type 3"]
};

【问题讨论】：

请在jsbin之类的页面上添加相关代码或创建demo。
我添加了所需的信息。截图与代码无关，只是为了说明问题。

标签： angularjs jquery-select2 angularjs-select2

【解决方案1】：

尽量不要混淆jQuery 插件和angularjs。 Select2 这里有一个 angularjs 模块：angular-ui/ui-select

示例：http://jsbin.com/nojewamivu/1/edit?html,js,output

【讨论】：

完美运行！谢谢！