1

Tenho uma página de consulta de departamentos e nela tenho o botão cadastrar. Essa página é uma "view" que foi definida como rota e é chamada dentro de meu index.html.

Gosaria de saber como é possível ao clicar no botão cadastrar, mudar a view que estou para a de cadastro que irei utilizar.

Tenho que usar algum serviço específico do angular ?

essas são minhas rotas:

$routeProvider
    .when("/cadastro/produtos", {
        templateUrl: 'view/consultaDeProdutos.html',
        controller: 'productRegisterController as vm'
    })

    .when("/cadastro/categorias", {
        templateUrl: 'view/consultaDeCategorias.html',
        controller: 'categoryRegisterController as vm'
    })

    .when("/cadastro/departamentos", {
        templateUrl: 'view/consultaDeDepartamentos.html',
        controller: 'departmentRegisterController as vm'
    })

    .when("/cadastro/departamentos/salvar", {
        templateUrl: 'view/cadastroDeDepartamentos.html',
        controller: 'departmentRegisterController as vm'
    })

Quero da rota /cadastro/departamentos ir para /cadastro/departamentos/salvar

através de um button

5
  • se tem algum código?
    – novic
    Commented 16/07/2017 às 0:05
  • Sim, já adicionei na pergunta
    – Henrique
    Commented 16/07/2017 às 0:10
  • Porque tem alias vm para todas os controller? isso não está errado?
    – novic
    Commented 16/07/2017 às 0:13
  • Como assim para todos controllers ? Eu uso um alias para não usar o $scope
    – Henrique
    Commented 16/07/2017 às 0:16
  • Henrique coloca todo o código
    – novic
    Commented 16/07/2017 às 0:17

1 Resposta 1

0

Você precisa usar o serviço $location para mudar de rotas/views.

app.controller('departmentRegisterController', ['$location', '$scope', function ($location,$scope) {

    var vm = this;

    vm.Cadastrar = function() {
        $location.path('/cadastro/departamentos/salvar');
    }

}]);

Daí no botão você pode usar assim:

<button ng-click="vm.Cadastrar()">Cadastrar</button>

No controller da tela de cadastro (no teu caso é o mesmo controller), você pode criar outro método para voltar para a lista de departamentos:

vm.ExibirListaDeDepartamentos = function() {
    $location.path('/cadastro/departamentos');
}

E criar um botão Cancelar ou Voltar como esse:

<button ng-click="vm.ExibirListaDeDepartamentos()">Cancelar</button>
6
  • Eu tinha tentado dessa forma também, porém não deu certo... ele entende que estou passando uma rota inexistente e cai no "othrewise" redirecionando para meu index. Sabe o por que disso?
    – Henrique
    Commented 16/07/2017 às 13:17
  • @Henrique que estranho. Está utilizando exatamente "/cadastro/departamentos/salvar"? Você pode incluir o código do teu controller onde você utiliza o $location? Pelo menos para a view "/cadastro/departamentos" você consegue ir? Commented 16/07/2017 às 13:21
  • Funcionou Alisson, descobri um erro de sintaxe no meu index.... então esse procedimento fucionou perfeitamente. Obrigado! Você acha melhor eu mudar minhas rotas e usar state do ui-router do que ngRoute ?
    – Henrique
    Commented 16/07/2017 às 13:41
  • @Henrique o ui-router tem tudo o que o ngRoute tem e mais algumas coisas, de cabeça o mais atrativo é que o ui-router permite você usar views aninhadas, enquanto no ngRoute você só pode utilizar uma view por vez. Para apps mais simples e caso você não esteja com tempo de aprender o ui-router, use o ngRoute mesmo. Mas se você já souber ou tiver tempo, sugiro o ui-router. Commented 16/07/2017 às 13:47
  • Cara esse $location utiliza algum tipo e cache ? Ele ta redirecionando para a view que optei, mas qualquer mudança que faço no html não reflete na view.... E estou salvando tudo certo...
    – Henrique
    Commented 16/07/2017 às 14: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 .