3

Estou com o seguinte problema, tenho mais de um estado de navegação no angular que utiliza o mesmo controller, dessa forma:

.state('app.estado-navegacao-1', {
  url: "/estado-navegacao-1",
  views: {
    'menuContent': {
      templateUrl: "templates/estado1.html",
      controller: 'EstadoNavegacaoCtrl',
      controllerAs: 'estado'
    }
  }
})

.state('app.estado-navegacao-2', {
  url: "/estado-navegacao-1",
  views: {
    'menuContent': {
      templateUrl: "templates/estado2.html",
      controller: 'EstadoNavegacaoCtrl',
      controllerAs: 'estado'
    }
  }
})

Pois bem, gostaria que ao "executar" esse estado, entrasse no controller, executasse os métodos normais e uma function que variasse de acordo com o estado de navegação escolhido.

O meu controller está mais ou menos assim:

angular.module('controllers.estadonavegacao', [])
    .controller('EstadoNavegacao', EstadoNavegacao);

function EstadoNavegacao() {

    var vm = this;
    vm.init = init;
    vm.funcao = funcao;
    vm.funcao2 = funcao2;

    //Executa Normal nas duas chamadas
    init();

    function init() {

    };

    function funcao() {
     //Quero executar após o estado de navegação 1   
    };

    function funcao2() {
     //Quero executar após o estado de navegação 2  
    };

};

Alguém tem alguma ideia de como fazer para funcionar dessa forma?

2
  • 1
    Além das duas respostas, por uma questão de organização e manutenção de código, sugiro que não utilize o mesmo controller para mais de uma view. Com funções simples não há problema, mas você pode ter boas dores de cabeça quando tiver algo mais complexo. Commented 30/05/2016 às 18:48
  • Sim, eu havia pensando nisso, mas é que utilizo o controller para gerar charts, e cada function é um chart diferente, porém do mesmo controller. O que muda é basicamente a consulta e a forma de exibição, fazer vários controllers a mais daria um trabalho muito maior de codificação. separei assim: Compras, Financeiro, etc...
    – Geferson
    Commented 30/05/2016 às 19:42

2 Respostas 2

3

Além das opções citadas, pode usar o resolve:

.state('app.estado-navegacao-1', {
    url: "/estado-navegacao-1",
    //...
    resolve: { 
        // os comandos desejados aqui dentro, por exemplo
        message: function(messageService){
            return messageService.getMessage();
        }
    }
})

E ter disponível no controller:

app.controller("myController", function (message) {
    $scope.message = message;
});

Dependendo da sua necessidade, tem uma solução.

2

Pode usar o serviço $location para obter o path que está sendo executado.

function EstadoNavegacao($location) {
  //...

  init();

  function init() {
    var path = $location.path();
    if (path === '/estado-navegacao-1')
      funcao();
    else
      funcao2();
  };
};

Ou ainda, você pode manipular o escopo do controller usando o atributo data.

.state('app.estado-navegacao-1', {
  url: "/estado-navegacao-1",
  //...
  data: { estadoNavegaco: 1 }
})

.state('app.estado-navegacao-2', {
  url: "/estado-navegacao-1",
  //...
  data: { estadoNavegaco: 2 }
});

E acessa a propriedade pelo escopo do controller:

function EstadoNavegacao() {
  var controller = this;

  init();

  function init() {
    if (controller.estadoNavegacao === 1)
      funcao();
    else
      funcao2();
  };
};
3
  • 1
    Pode usar também o resolve, semelhante ao data.
    – Shura16
    Commented 30/05/2016 às 17:34
  • Legal, não havia pensando nessas possibilidades, valeu mesmo!!
    – Geferson
    Commented 30/05/2016 às 17:35
  • É outra ótima solução @Shura16. Poste um exemplo como resposta, quanto mais conteúdo melhor. :) Commented 30/05/2016 às 17:37

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 .