1

Estou fazendo uma aplicação com angularJS. tenho páginas sendo chamadas, porém, uma única, não aparece.

Seguem meus códigos:

app.js

var app = angular.module("vc", ["ui.router"]);

app.config(function($stateProvider){
$stateProvider
    .state("login", {
        url:"/",
        controller: "LoginController",
        templateUrl: "admin/views/login.html"
    })

    .state("painel", {
        url: "/painel",
        controller: "PainelController",
        templateUrl: "admin/views/painel.html"
    })

    .state("usuario", {
        url: "/usuario",
        controller: "UsuarioController",
        templateUrl: "admin/views/usuario.html"
    })

    .state("paises", {
        url: "/paises",
        controller: "PaisesController",
        templateUrl: "admin/views/paises.html"
    })

    .state("atualizarUsuario", {
        url: "/atualizarUsuario",
        controller: "AtualizarUsuarioController",
        templateUrl: "admin/views/atualizarUsuario.html"
    })


})

index.html

<html ng-app="vc">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="css/vc.css">
<body>
    <div ui-view></div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>
<script src="http://angular-ui.github.io/ui-router/release/angular-ui-router.js"></script>
<script src="admin/js/app.js"></script>
<script src="admin/js/loginController.js"></script>
<script src="admin/js/painelController.js"></script>
<script src="admin/js/usuarioController.js"></script>
<script src="admin/js/atualizarUsuarioController.js"></script>
</html>

Segue print de onde estão os arquivos .html Telas

E print da estrutura usuario.html onde tem o link para a página que não aparece usuario.html

4

1 Resposta 1

2

Para o Ui Router funcionar, a url digitada no endereço, deve ser igual a url definida no .state. No seu caso, você ainda tem um número depois, que acredito que seja o id do usuário, então você ainda vai precisar de um param.

Começando do básico, recomendo você usar o seguinte código:

$urlRouterProvider.when('', '/inicio'); //Colocar o nome da URL, não do state
$urlRouterProvider.when('/', '/inicio'); //Colocar o nome da URL, não do state
$urlRouterProvider.otherwise('/Erro'); //Quando não existir nenhum, direciona para página de erro

Isso irá redirecionar você para o state com url de inicio, assim você tem um state inicial mesmo não digitando nada na url. Deste modo você não precisa ter o login com a url sem preenchimento, deixando a aplicação mais dinâmica.

Já no seu caso em específico, notei que você está tentando acessar uma url com um parametro: "atualizarUsuario/2", presumo que seja o ID do usuário a ser atualizado.

Para isso, você precisa definir na configuração do .state que ele terá um parâmetro com determinado nome. Exemplo:

.state('meuestado', {
    url:'/suaurl/:id'
})

E no link que irá direcionar para essa página deve definir também o parâmetro, deste modo:

ui-sref="meuestado({id: usuario.id})" //O nome 'usuario.id' é a sua referência ao id do usuário

Dentro do seu controller, você pode acessar esse valor do seguinte modo:

$state.current.params.id; //Basta injetar o $state na inicialização do controller

Outra recomendação que faço, é de não utilizar o ui-view em branco, é bom sempre atribuir um nome para ele, assim você também pode determinar qual state vai aparecer em qual view.

ui-view="main

//e a configuração seria:

.state('inicio', {
    url:'/Inicio',
    views: {
        "main": {
            templateUrl: "meu/caminho/inicio.html"
        }
    }
}

Provavelmente com isso você já vai conseguir seguir o seu .state corretamente. Espero que ajude.

3
  • Celso, não estou usando ui-router, mas na configuração é o $stateProvider... Mas acho que mesmo assim, o erro é por eu não estar passando o id na url na configuração da rota. 8/01/2016 às 21:53
  • É isso mesmo Celso, faltava o id: .state("atualizarUsuario", { url: "/atualizarUsuario/:id", //controller: "EstadoController", templateUrl: "admin/views/atualizarUsuario.html" }) 8/01/2016 às 21:56
  • Você não está utilizando o ui-router? Por que você iniciou ele no module e a referência do view é o ui-router hahaha Mas se resolveu, que bom! 8/01/2016 às 22:01

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .