AngularJS ui router passando dados entre estados sem URL

Eu estou enfrentando esse problema de passar dados entre dois estados sem expor os dados no URL, é como se o usuário não pudesse pousar diretamente nesse estado.

Por exemplo. Eu tenho dois estados “A” e “B”. Eu estou fazendo alguma chamada de servidor no estado “A” e passando a resposta da chamada para o estado “B”. A resposta da chamada do servidor é uma mensagem de string, que é bem longa, então não posso expor isso na url.

Então, existe alguma maneira no roteador ui angular para passar dados entre estados, sem usar parâmetros de URL?

Podemos usar params , novo recurso do roteador de interface do usuário:

Referência da API / ui.router.state / $ stateProvider

params Um mapa que, opcionalmente, configura os parâmetros declarados na url, ou define parâmetros adicionais que não são url. Para cada parâmetro que está sendo configurado, inclua um object de configuração codificado para o nome do parâmetro.

Veja a parte: ” … ou define parâmetros adicionais que não sejam url …

Então a def do estado seria:

 $stateProvider .state('home', { url: "/home", templateUrl: 'tpl.html', params: { hiddenOne: null, } }) 

Alguns exemplos formam o documento mencionado acima :

 // define a parameter's default value params: { param1: { value: "defaultValue" } } // shorthand default values params: { param1: "defaultValue", param2: "param2Default" } // param will be array [] params: { param1: { array: true } } // handling the default value in url: params: { param1: { value: "defaultId", squash: true } } // squash "defaultValue" to "~" params: { param1: { value: "defaultValue", squash: "~" } } 

EXTEND – exemplo de trabalho: http://plnkr.co/edit/inFhDmP42AQyeUBmyIVl?p=info

Aqui está um exemplo de uma definição de estado:

  $stateProvider .state('home', { url: "/home", params : { veryLongParamHome: null, }, ... }) .state('parent', { url: "/parent", params : { veryLongParamParent: null, }, ... }) .state('parent.child', { url: "/child", params : { veryLongParamChild: null, }, ... }) 

Esta poderia ser uma chamada usando ui-sref:

 home parent parent.child 

Veja o exemplo aqui

O object params está incluído em $ stateParams, mas não fará parte do URL.

1) Na configuração da rota:

 $stateProvider.state('edit_user', { url: '/users/:user_id/edit', templateUrl: 'views/editUser.html', controller: 'editUserCtrl', params: { paramOne: { objectProperty: "defaultValueOne" }, //default value paramTwo: "defaultValueTwo" } }); 

2) no controlador:

 .controller('editUserCtrl', function ($stateParams, $scope) { $scope.paramOne = $stateParams.paramOne; $scope.paramTwo = $stateParams.paramTwo; }); 

3A) Alterando o estado de um controlador

 $state.go("edit_user", { user_id: 1, paramOne: { objectProperty: "test_not_default1" }, paramTwo: "from controller" }); 

3B) Mudando o estado em html

 

Exemplo de Plunker