Eu tenho um formulário, este o qual pode ser inserido mais um grupo de "Nome" e "Agência" somente ao clicar ao botão. Estou usando AngularJS e ng-Repeat para repetir os campos no momento em que clica em +. Porém, a lista de nomes das Agências "perde" no momento em que insiro um novo contato.
Como faço para que essa lista "persista"?
** #select-tools refere-se ao Campo "Buscar agência"
Quando insiro mais um não há nenhum elemento na lista
HTML
<div class="form-group">
<h4>Contatos</h4>
<div ng-repeat="contato in contatos" class="form-group">
<label class="control-label col-sm-2">Nome:</label>
<div class="col-sm-10">
<input type="text" class="form-control" ng-model="contato.nome">
</div>
<div class="form-group">
<h4>Agência</h4>
<div class="control-group">
<select ng-options="agencia.nome for agencia in listaAgencias" class="demo-default" placeholder="Selecionar a agência..." selectize>
</select>
</div>
</div>
</div>
<div align="right">
<button type="button" class="btn btn-xs btn-primary" ng-click="novoContato()">
<span class="glyphicon glyphicon-plus"></span>
</button>
<button type="button" class="btn btn-xs btn-danger" ng-click="excluirContato()"
ng-disabled="contatosVazio()">
<span class="glyphicon glyphicon-minus"></span>
</button>
</div>
</div>
Controller.js
oknok.controller('veiculoController', function ($scope, veiculosAPI, agenciasAPI) {
agenciasAPI.getAgencias().success(function (data) {
var embedded = data._embedded;
$scope.listaAgencias = embedded.agencias;
$('#select-tools').selectize({
maxItems: null,
valueField: 'nome',
labelField: 'nome',
searchField: 'nome',
options: embedded.agencias,
create: false
});
}).catch(function (error) {
alert("Erro ao obter listagem de agencias");
console.log(JSON.stringify(error));
});
$scope.contatos = [{
nome: "",
dados: []
}];
$scope.cancelar = function () {
window.location.href = "/"
};
$scope.novoContato = function () {
$scope.contatos.push({
nome: "",
email: ""
});
};
$scope.excluirContato = function () {
var ultimoItem = $scope.contatos.length - 1;
$scope.contatos.splice(ultimoItem);
};
$scope.contatosVazio = function () {
if (!($scope.contatos.length <= 1)) {
return false;
} else {
return true;
}
};
});