AngularJS:我们如何使用 AngularJS 将选择框和选项动态添加到 DOM 中

Question

一旦带有空选项的选择框被动态添加到 DOM，我们如何将选项(ng-options)添加到该选择框。
我有一个场景，用户可以在运行时向 DOM 添加多个选择框，然后他可以向动态添加的选择框添加值。

非常感谢您对此的任何帮助。
非常感谢。

Answer 1

select 元素的 ng-options 属性可以帮助您迭代生成选项。您可以在 Controller 中维护动态选项。一旦选项数据模型更新，选择元素的选项将被刷新。

查看

<div ng-controller="myCtrl">
  <select ng-model="selected" ng-options="o.label for o in options">
    <option value="">-------</option>  <!--not selected option-->
  </select>
  <button ng-click="addOption('option'+(options.length+1))">Add</button>
</div>

Controller

angular.module('app',[])
.controller("myCtrl",function($scope){
  $scope.options = [{label:"option1",value:"1"},{label:"option2",value:"2"},{label:"option3",value:"3"}];

  $scope.addOption = function(text){
    $scope.options.push({label:text,value:text});
  }
});

这是一个 jsfiddleDemo .

希望这对你有帮助。