get a function of another controller angularjs
get a function of another controller angularjs
I have a table that contains the product listing with the respective controller. From this table I open a modal to include a product that uses another controller. The issue is that when saving a record, I need to update the table using a method that is in the list controller. I found some solutions but none worked. Does anyone have a workable solution?
controller of my list
app.controller("listaProdutoController", function ($scope, $http, $q,usuario, produto, $rootScope)
var vm = this;
vm.produto=;
vm.produtos=;
vm.tituloPanel="Produtos";
vm.quantidaDeRegistrosPorPagina="5";
vm.pagina = 0;
vm.filtro = "";
vm.quantidadeDeRegistros = 0;
vm.ultimaPagina = false;
vm.primeiraPagina = false;
vm.ultimoRegistroDaPagina = 0;
vm.filtrar = function()
vm.carregarProdutos();
;
vm.carregarProdutos=function(zerarPaginacao)
if (zerarPaginacao)
vm.pagina = 0;
produto.getProdutoPaginado(vm.pagina, parseInt(vm.quantidaDeRegistrosPorPagina), vm.filtro ).then(function (retorno)
vm.produtos = retorno.conteudo;
vm.quantidadeDeRegistros = retorno.quantidadeDeRegistros;
vm.ultimaPagina = retorno.ultimaPagina;
vm.primeiraPagina = retorno.primeiraPagina;
vm.ultimoRegistroDaPagina = vm.pagina * vm.quantidadeDeRegistros + parseInt(vm.quantidaDeRegistrosPorPagina);
if (vm.ultimoRegistroDaPagina > vm.quantidadeDeRegistros)
vm.ultimoRegistroDaPagina = vm.quantidadeDeRegistros;
);
;
vm.carregarProdutos(); // this method that a need to call in another controller.
);
my other controller
app.controller("cadastroProdutoController", function ($http, $location, $q,usuario, produto)
var vm = this;
vm.produto=;
vm.salvarProduto = function()
produto.salvar(vm.produto).then(function (retorno)
//here i need to put that function
);
;
);
look that my html
<div ng-controller="listaProdutoController as vm">
<div class="mr-4 ml-4">
<div class="p-lg-5"></div>
<div class="card ">
<div class="card-header">
vm.tituloPanel
</div>
<div class="card-body">
<div class="row">
<div class="form-group row col-md-12">
<div class="form-group col-md-4">
<input type="text" ng-model="vm.filtro" ng-keyup="vm.filtrar($event)" placeholder="Buscar" class="form-control mt-2 form-control-sm">
</div>
<div class="form-group col-md-8">
<div class="float-right">
<button type="button" data-toggle="modal" data-target="#modalCadastroProduto" class="btn btn-blue-grey btn-sm">Adicionar</button>
</div>
</div>
</div>
</div>
<div class="row">
<div class="form-group row col-md-12">
<div class="form-group col-md-1">
<button type="button" ng-click="vm.proximaPagina()" class="btn btn-blue-grey btn-sm"> ></button>
</div>
<div class="mt-2 form-group col-md-1">
<select ng-change="vm.carregarProdutos(true)" ng-model="vm.quantidaDeRegistrosPorPagina" class="form-control-sm">
<option value="5">5</option>
<option value="10">10</option>
<option value="15">15</option>
<option value="20">20</option>
<option value="30">30</option>
<option value="40">40</option>
<option value="50">50</option>
<option value="100">100</option>
</select>
</div>
<div class="form-group col-md-1">
<button type="button" ng-click="vm.paginaAnterior()" class="btn btn-blue-grey btn-sm"> <</button>
</div>
</div>
</div>
<table class="table table-hover table-sm table-bordered " id="tableProduto" cellspacing="0" width="100%">
<thead>
<tr>
<th class="th-sm">Id</th>
<th class="th-sm">Descrição</th>
<th class="th-sm">Observação</th>
<th class="th-sm">Opções</th>
</tr>
</thead>
<tbody ng-repeat="pro in vm.produtos">
<tr>
<td>pro.idProduto</td>
<td>pro.descricao</td>
<td>pro.observacao</td>
<td>
<button class="btn btn-blue-grey btn-sm dropdown-toggle" type="button" data-toggle="dropdown"></button>
<div class="dropdown-menu">
<a class="dropdown-item">Alterar</a>
<a class="dropdown-item" ng-click="vm.excluir(pro)">Excluir</a>
</div>
</td>
</tr>
</tbody>
<tfoot>
</tfoot>
</table>
</div>
</div>
</div>
</div>
i include the modal with ng-include
<div class="modal fade" data-backdrop="static" data-keyboard="false" tabindex="-1" aria-labelledby="myModalLabel" aria-hidden="true" id="modalCadastroProduto" role="dialog">
<div ng-include src="'./module/cadastroProdutoComponent/cadastroProduto.html'"></div>
</div>
and the modal
<div ng-controller="cadastroProdutoController as vm">
<div class="modal-dialog modal-lg modal-top" role="document">
<div class="modal-content">
<div class="modal-header">
Cadastro de Produto
</div>
<div class="modal-body">
<form novalidate name="formProduto" role="form">
<div class="row">
<div class="form-group row col-md-12">
<div class="form-group col-md-3">
<input type="number" ng-model="vm.produto.idProduto" disabled placeholder="Id" class="form-control form-control-sm">
</div>
<div class="form-group col-md-9">
<input type="text" ng-model="vm.produto.descricao" maxlength="60" placeholder="Descrição" class="form-control form-control-sm">
</div>
<div class="form-group col-md-12">
<textarea placeholder="Observação" ng-model="vm.produto.observacao" maxlength="250" class="form-control form-control-sm" rows="2"></textarea>
</div>
</div>
</div>
</form>
</div>
<div class="modal-footer d-flex justify-content-center">
<button data-dismiss="modal" ng-click="vm.salvarProduto()" class="btn btn-blue-grey btn-sm mt-1">Salvar</button>
<button class="btn btn-blue-grey btn-sm mt-1">Salvar e adicionar novo registro</button>
<button data-dismiss="modal" class="btn btn-blue-grey btn-sm mt-1">Cancelar</button>
</div>
</div>
</div>
</div>
1 Answer
1
You need to use then method on the result of your modal instance:
then
result
$uibModal.open(
controller : 'cadastroProdotoController'
).result.then(() =>
vm.carregarProdutos();
);
If you want to pass data from modal to the initial controller. inside the modal controller you need to close the instance with:
$uibModalInstance.close(data);
// where `data` is what you want to pass
and to change the above to
...
}).result.then(data =>
// use the returned data
)
For convenience, you can place the modal instance in vm:
vm.modal = $uibModal.open(/*params here*/);
vm.modal.result.then(data => /*use data from modal*/)
Thanks for contributing an answer to Stack Overflow!
But avoid …
To learn more, see our tips on writing great answers.
Required, but never shown
Required, but never shown
By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.