Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Estou com problema pra exibir o modal de detalhe

usuario.jsp

<td class="align-right"><a href="" 
                                ng-click="showModalAtualizaUsuario(usuario)"
                                title="Visualizar" data-dismiss="modal" data-toggle="modal"><i
                                    class="material-icons col-blue">visibility</i></a>

controller/usuario-controller.js

omniApp.controller('UsuarioController', function($scope, $rootScope,  usuarioService, messageService) {

$scope.usuario  = [];

$scope.showModalAtualizaUsuario = function(){
        $scope.usuarioDetalhe = this.usuario;
        $('#modalUsuarioDetalhe').modal('show');
    }

});

modal-usuario-detatalhe.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

<!-- MODAL ADICIONAR USUÁRIO -->
<div class="modal" tabindex="-1" role="dialog" id="modalUsuarioDetalhe">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"
                    aria-hidden="true">×</button>
                <h4 class="modal-title">Editar Usuário</h4>
            </div>
            <form>
                <div class="modal-body">
                    <fieldset>
                        <!--<legend></legend>-->
                        <div class="form-group">
                            <label for="titulo" class="col-lg-2 control-label">Usuário</label>
                            <div class="col-lg-10">
                                <input type="text" class="form-control" id="usuario"
                                    ng-model="usuario.nome" />
                            </div>
                        </div>
                    </fieldset>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal"
                        id="voltarPopup">Voltar</button>
                    <button type="button" class="btn btn-primary" id="salvarPopup"
                        data-dismiss="modal" ng-click="salvarUsuario()">Salvar</button>
                </div>
            </form>
        </div>
    </div>
</div>

Ocorre que o modal é chamado mas não carrega os dados no campo input.

2 respostas
solução!

Bom dia!

Tive dificuldade de entender seu código, pois não faz sentido usar jQuery dentro de um controller do Angular. Fazendo isso, você joga fora tudo aquilo que o framework tenta lhe proporcionar, que é evitar de ter que manipulador o DOM. Talvez isso seja um forte indício de que o Angular não uma boa indicação para o projeto que esta criando, é algo a se pensar. Outro ponto é que você esta usando Angular com JSP (talvez seja a causa do seu problema, não sei ao certo), a ideia do Angular é você ter a camada front-end separada totalmente da camada de backend, isto é, seu backend fornece apenas uma API para sua app Angular. Todavia, ok, não o impede de fazer isso, apesar de não ser prática de mercado.

Falando ainda a respeito de manipulação de DOM, elas são realizadas em diretivas. Todavia, criar suas próprias diretivas pode ser algo complicado, por isso sugiro procurar diretivas prontas que encapsulam os componentes do bootstrap. Não uso bootstrap para essa finalidade, logo, não tenho nenhuma recomendação nesse sentido. Mas pesquisando na internet lembrei do promissor UI Bootstrap.

https://angular-ui.github.io/bootstrap/

Inclusive no própria site ele dá exemplo de código como chamar um modal. Talvez seja um caminho mais interessante e lhe poupará tempo.

Bem isso mesmo, usar JQuery com Angular não é uma boa. É que o projeto ta uma bagunça e refatorar agora não é boa escolha, mas, o que pretendo mais adiante é ficar só com Angular e Bootstrap. Vou seguir o seu conselho e estudar mais a documentação do UI Bootstrap. De certa forma eu corrigi o erro do modal. Na página usuario.jsp tem a div

<div class="container" ng-controller="UsuarioController" >

E quando chamava o modal não carregava os dados. Tirei o

ng-controller="UsuarioController"

e tudo funcionou perfeitamente. Não sei o que houve, algum conflito, sei lá...

Mas muito obrigado por me responder e pela dica também. Abraço.