我有一个表，其中包含带有相应控制器的产品列表。从该表中，我打开一个模态以包含使用另一个控制器的产品。问题是，保存记录时，我需要使用列表控制器中的方法来更新表。我找到了一些解决方案，但没有一个有效。有人有可行的解决方案吗？
我的列表的控制器
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.
});
我的其他控制器
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
});
};
});
看我的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在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>
和模式
<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>
答案 0 :(得分：0)
您需要在模态实例的then上使用result方法：
$uibModal.open({
controller : 'cadastroProdotoController'
}).result.then(() => {
vm.carregarProdutos();
});
如果要将数据从模态传递到初始控制器。在模态控制器内部，您需要使用以下命令关闭实例：
$uibModalInstance.close(data);
// where `data` is what you want to pass
，并将以上内容更改为
...
}).result.then(data => {
// use the returned data
})
为方便起见，您可以将模式实例放置在vm中：
vm.modal = $uibModal.open({/*params here*/});
vm.modal.result.then(data => {/*use data from modal*/})