Entrei num loop infinito quando tentei chamar uma função de dentro de um ngRepeat.
20/12/2016
0
Entrei num loop infinito quando tentei chamar uma função de dentro de um ngRepeat.
Ex:
ng-repeat="medico in medicos" | oderby:...
...
<td ng-bind="GetNameMedico(medico.MedicoId)"></td>
...
Entro num loop Infinito... Aff...
Obs.: Meu serviço com WebAPI está funcionando, se eu tento com ng-click="GetNameMedico(medico.MedicoId)" também funciona, mas numa lista <li> ou numa tabela <tr><td>... Não. Entro no loop infernal!
Talvez seja problema do $scope. sei lá... ?!
Grato,
Carlos Alberto
Essa dúvida foi gerada a partir de um comentário no artigo [url:descricao=Introdução ao AngularJS - Curso Completo de AngularJS - Aula 1]https://www.devmedia.com.br/introducao-ao-angularjs-curso-completo-de-angularjs-aula-1/32148[/url]
Carlos Santos
Posts
20/12/2016
Péricles Samba
Você pode mostrar um pouco mais do seu código?
20/12/2016
Carlos Santos
1. Tenho um objeto Medico, com: MedicoId, Nome, Crm, IdEsecialidade, etc.;
2. Tenho um segundo objeto que é ChamadaMedico, que guarda as chamadas aos médicos para atendimento de emergência em Leitos específicos e isso fica num Mural do sistema;
3. No objeto ChamadaMedico eu gravava o Nome do Médico, mas refatorei esse processo e agora gravo seu Id;
4. Montei um CRUD com Busca, Paginação, Ordenação, Validação e ainda exponho esses dados numa API em Asp.Net Web API... tudo funcionando perfeito;
5. Mas agora, na minha tabela ou na minha lista quero mostrar o nome do Medico, buscando-o através de seu Id;
6. Já criei o Controller WebApi no Back-End (com Asp.Net Web API), já criei o Servico e o Controller (no Front-End com AngularJS);
7. Fiz uns testes tanto no Back quanto no Front e na API e tudo ok, mas no AngularJS testei com o ng-Click. Como é só uma chamada ele me retorna o nome do Medico sem problemas, mas ao tentar executar a mesma função no loop do ng-repeat aí não tem jeito; entra no Loop infinito e nem mostra os dados. Pus um debugger e debuguei, através do Chrome e vi que ele fica repetindo a mesma sequência de Id AdEterno...
Desculpe pelo texto grandão, mas tentei ser o mais explícito possível!
Vou postar o código daqui a pouco!
Grato pela atenção!
20/12/2016
Carlos Santos
- Segue a função no meu controller AngularJS.
Não postei o código do Service, pois ele retorna sem problemas o Nome do Medico.
$scope.nomeMedico = "";
$scope.GetDescMedico = function (id) {
debugger;
var medicoData = getDiscriptionsService.GetDiscriptionMedico(id);
medicoData.then(function (medico) {
$scope.nomeMedico = medico.data;
delete $scope.nomeMedico;
}, function () {
toastr["error"]("Erro ao obter Nome do Médico!", "Nome do Sistema");
});
};
Agora na View eu tento mostrar o Nome e não o Id. Segue o código:
<tbody>
<tr dir-paginate="chamadamedico in chamadaMedicos | filter:criterioDeBusca | orderBy:criterioDeOrdenacao:direcaoDaOrdenacao | itemsPerPage:5" pagination-id="chamadamedico">
<td ng-bind="chamadamedico.ChamadaMedicoId"></td>
<td ng-bind="chamadamedico.Leito"></td>
<td ng-bind="GetDescMedico(chamadamedico.Medico)"></td> <!--/ AQUI ESTÁ O PROBLEMA -->
<td ng-bind="chamadamedico.Mensagem"></td>
<td>{{chamadamedico.DataChamada | date:'dd/MM/yyyy'}}</td>
<td>
<button class="btn btn-primary" ng-disabled="inibeBtnAtualizar()" ng-click="obterPorId(chamadamedico)" data-id="edit" data-toggle="tooltip" data-placement="bottom" title="Editar Chamadamedico" data-original-title="Editar Chamadamedico"><i class="glyphicon glyphicon-edit"></i></button>
<button class="btn btn-danger" ng-disabled="inibeBtnExcluir()" ng-click="ExcluirChamadamedico(chamadamedico)" data-id="delete" data-toggle="tooltip" data-placement="bottom" title="Excluir Chamadamedico" data-original-title="Excluir Chamadamedico"><i class="glyphicon glyphicon-trash"></i></button>
</td>
</tr>
</tbody>
<dir-pagination-controls max-size="5"
pagination-id="chamadamedico"
direction-links="true"
boundary-links="true">
</dir-pagination-controls>
</td>
</tr>
</tbody>
<dir-pagination-controls max-size="5" pagination-id="chamadamedico" direction-links="true" boundary-links="true"></dir-pagination-controls>
</table>
</div>
20/12/2016
Carlos Santos
delete $scope.nomeMedico;
20/12/2016
Carlos Santos
http://prntscr.com/dltgaj
E este é o código SEM a função:
<tbody>
<tr dir-paginate="chamadamedico in chamadaMedicos | filter:criterioDeBusca | orderBy:criterioDeOrdenacao:direcaoDaOrdenacao | itemsPerPage:5" pagination-id="chamadamedico">
<td ng-bind="chamadamedico.ChamadaMedicoId"></td>
<td ng-bind="chamadamedico.Leito"></td>
@*<td ng-bind="GetDescMedico(chamadamedico.Medico)"></td> COMENTADO!!! *@
<td ng-bind="chamadamedico.Medico"></td> <!--/ CHAMADA ORIGINAL, RETORNANDO O ID -->
<td ng-bind="chamadamedico.Mensagem"></td>
<td>{{chamadamedico.DataChamada | date:'dd/MM/yyyy'}}</td>
<td>
<button class="btn btn-primary" ng-disabled="inibeBtnAtualizar()" ng-click="obterPorId(chamadamedico)" data-id="edit" data-toggle="tooltip" data-placement="bottom" title="Editar Chamadamedico" data-original-title="Editar Chamadamedico"><i class="glyphicon glyphicon-edit"></i></button>
<button class="btn btn-danger" ng-disabled="inibeBtnExcluir()" ng-click="ExcluirChamadamedico(chamadamedico)" data-id="delete" data-toggle="tooltip" data-placement="bottom" title="Excluir Chamadamedico" data-original-title="Excluir Chamadamedico"><i class="glyphicon glyphicon-trash"></i></button>
</td>
</tr>
</tbody>
Grato!
20/12/2016
Carlos Santos
<div>
<span class="btn btn-primary" ng-disabled="chamadamedicoForm.$invalid" ng-click="AdicionarEditarChamadamedico()">Salvar</span>
<span class="btn btn-danger" ng-click="cancelaEdicao()">Calcelar</span>
<!--/ AQUI -->
<button class="btn btn-danger" ng-click="GetDescMedico(chamadamedico.Medico)" data-id="delete" data-toggle="tooltip" data-placement="bottom" title="Nome do Médico" data-original-title="Nome do Médico"><i class="glyphicon glyphicon-envelope"></i></button>
<h3>{}</h3>
</div>
Olha a tela:
http://prntscr.com/dltmjq
Grato.
22/12/2016
Péricles Samba
Você precisa dar o retorno pela função.
$scope.GetDescMedico = function (id) {
debugger;
var medicoData = getDiscriptionsService.GetDiscriptionMedico(id);
medicoData.then(function (medico) {
$scope.nomeMedico = medico.data;
return medico.data; //retornar o valor pela função
}, function () {
toastr["error"]("Erro ao obter Nome do Médico!", "Nome do Sistema");
});
};Quando você colocou a função no onClick, ela funcionou porque você estava consultando o valor da variável utilizando o {}, mas sua função não está realmente retornando um valor para ser consultada direto.
Qualquer coisa, estamos ai :D
23/06/2017
Luan Oliveira
Você conseguiu resolver essa caso? Estou na mesma situação...
19/08/2017
Carlos Santos
Meu objeto ChamadaMedico tinha uma ForeignKey para Medico => IdMedico.
Bastou eu usar um .Include("Medico") na minha controller do Backend.
Algo assim:
var ChamadaMedico = (from cm in _db.ChamadaMedico.Include("Medico") select cm).Where(x=>x.ChamadaMedicoId == id).ToList();
A partir daí, meu objeto ChamadaMedico passa a conter o objeto Medico com todas as suas propriedades. Na listagem basta eu chamar:
=> ChamadaMedico.Medico.Nome, que que mostra o nome do Médico ao invés do Id.
Obrigado aí pela ajuda!
Abração!!!
Clique aqui para fazer login e interagir na Comunidade :)