Angularjs select2 设置选项已选中

Question

我想在用户单击 html 按钮时构建 select 列表 (select2) 选项。

我的HTML:

<select id="mySel2" class="form-control" multiple="multiple">
    <option ng-repeat="item in items" ng-selected="item.selected"
            ng-model="item.tag">
      {{item.tag}}
    </option>
</select>

Angular 点击按钮的js函数代码：

var fruits=angular.module("myApp",[]);
fruits.controller('ctrlTags',  function($scope){

  /* I HAVE SET DEFAULT VALUE TO SELECT LIST*/
  /* IT WORKING PERFECT WITH SHOWING SELECTED VALUES*/
    var tagsData = [
      {id:1,tag:'Apple'},
      {id:2,tag:'Banana'},
      {id:3,tag:'Cherry'},
      {id:4,tag:'Cantelope'},
      {id:5,tag:'Grapefruit'},
      {id:6,tag:'Grapes',selected:true},
      {id:7,tag:'Lemon'},
      {id:8,tag:'Lime'},
      {id:9,tag:'Melon',selected:true},
      {id:10,tag:'Orange'},
      {id:11,tag:'Strawberry'},
      {id:11,tag:'Watermelon'}
    ];  

     $scope.items = tagsData;

     /*NOW ON BUTTON CLICK GETKEY() FUNCTION WILL BE CALLED*/
     /* AND I WANT TO RENDER/REFRESH SELECT LIST WITH NEW DATA */
     $scope.getKey=function(data){   
         var newData = [
          {id:4,tag:'car'},
          {id:5,tag:'bat',selected:true},
          {id:6,tag:'cat',selected:true},
          {id:7,tag:'Lemon'},
          {id:8,tag:'Lime'},

        ];
    $scope.items=newData;

    };
});

问题：在按钮上单击它正在更新 SELECT 列出值但不显示默认值 SELECTED 值

请告诉我如何刷新 SELECTED 值。

Answer 1

您需要将模型添加到 select 部分 ng-model="selected"。您可以添加例如第一个索引在控制器中 $scope.selected = tagsData[0]

Answer 2

使用select2（形式-widgets.js）

$('[name="NAME"]').select2({placeholder: ''}).val(VAL).change();

Angularjs select2 设置选项已选中

Angularjs select2 set options selected

angularjs

jquery-select2