AngularJS: Como adicionar dinamicamente Caixa de Seleção e opções para essa caixa de seleção para o DOM usando AngularJS - angularjs

Uma vez que a caixa de seleção com opções vazias é adicionadadinamicamente para o DOM, como adicionamos as opções (ng-options) a essa caixa de seleção. Eu tenho um cenário onde o usuário pode adicionar caixa de seleção múltipla para o DOM em tempo de execução e, em seguida, ele pode adicionar valores para as caixas de seleção adicionadas dinamicamente.

Qualquer ajuda sobre isso é muito apreciada. Muito Obrigado.

Respostas:

O atributo ng-options do elemento select podeajudá-lo a gerar opções iterativamente. Você poderia manter suas opções dinâmicas no controlador. As opções do elemento select serão atualizadas assim que o modelo de dados das opções for atualizado.

Visão

<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>

Controlador

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});
}
});

Aqui está um jsfiddleDemo.

Espero que este seja útil para você.