Como recarregar o estado atual?

Estou usando o Angular UI Router e gostaria de recarregar o estado atual e atualizar todos os dados / executar novamente os controladores para o estado atual e seu pai.

Eu tenho 3 níveis de estado: directory.organisations.details

directory.organisations contém uma tabela com uma lista de organizações. Clicar em um item da tabela carrega directory.organisations.details com $ StateParams passando o ID do item. Portanto, no estado de detalhes, carrego os detalhes desse item, edito-os e salve os dados. Tudo bem até agora.

Agora preciso recarregar esse estado e atualizar todos os dados.

Eu tentei:

 $state.transitionTo('directory.organisations');

Que vai para o estado pai, mas não recarrega o controlador, acho que porque o caminho não mudou. Idealmente, eu só quero permanecer no estado directory.organisations.details e atualizar todos os dados no pai também.

Eu também tentei:

$state.reload()

Eu já vi isso na API WIKI por $ state.reload "(bug com os controladores sendo restabelecidos agora, corrigidos em breve)."

Qualquer ajuda seria apreciada?

Eu achei que essa era a maneira mais curta de atualizar o ui-router:

$state.go($state.current, {}, {reload: true}); //second parameter is for $stateParams

Atualização para versões mais recentes:

$state.reload();

Qual é um alias para:

$state.transitionTo($state.current, $stateParams, { 
  reload: true, inherit: false, notify: true
});

Documentação: https://angular-ui.github.io/ui-router/site/#/api/ui.router.state.$state#methods_reload

Esta solução funciona no AngularJS V.1.2.2:

$state.transitionTo($state.current, $stateParams, {
    reload: true,
    inherit: false,
    notify: true
});

Essa seria a solução final. (inspirado na publicação de @ Hollan_Risley)

'use strict';

angular.module('app')

.config(function($provide) {
    $provide.decorator('$state', function($delegate, $stateParams) {
        $delegate.forceReload = function() {
            return $delegate.go($delegate.current, $stateParams, {
                reload: true,
                inherit: false,
                notify: true
            });
        };
        return $delegate;
    });
});

Agora, sempre que precisar recarregar, basta ligar para:

$state.forceReload();

para estrutura iônica

$state.transitionTo($state.current, $state.$current.params, { reload: true, inherit: true, notify: true });//reload

$stateProvider.
  state('home', {
    url: '/',
    cache: false, //required

https://github.com/angular-ui/ui-router/issues/582

Provavelmente, a abordagem mais limpa seria a seguinte:

<a data-ui-sref="directory.organisations.details" data-ui-sref-opts="{reload: true}">Details State</a>

Podemos recarregar o estado apenas do HTML.

A resposta de @Holland Risley agora está disponível como uma API no ui-router mais recente.

$state.reload();

Um método que força recarrega o estado atual. Todas as resoluções são resolvidas novamente, os controladores são restabelecidos e os eventos são disparados novamente.

http://angular-ui.github.io/ui-router/site/#/api/ui.router.state.$state

$state.go($state.current, $stateParams, {reload: true, inherit: false});

$scope.reloadstat = function () { $state.go($state.current, {}, {reload: true}); };

se você quiser recarregar sua página inteira, como parece, basta injetar $ window no seu controller e então chamar

$window.location.href = '/';

mas se você quiser apenas recarregar sua visualização atual, injete $ scope, $ state e $ stateParams (este último, caso você precise alterar alguns parâmetros nesta próxima recarga, algo como o número da sua página) e chame-o em qualquer método do controlador:

$stateParams.page = 1;
$state.reload();

AngularJS v1.3.15 angular-ui-router v0.2.15

Solução boba que sempre funciona.

$state.go("otherState").then(function(){
     $state.go("wantedState")
});

Para a v1.2.26 angular, nenhuma das opções acima funciona. Um ng-clique que chama os métodos acima terá que ser clicado duas vezes para fazer o estado recarregar.

Acabei emulando dois cliques usando $ timeout.

$provide.decorator('$state',
        ["$delegate", "$stateParams", '$timeout', function ($delegate, $stateParams, $timeout) {
            $delegate.forceReload = function () {
                var reload = function () {
                    $delegate.transitionTo($delegate.current, angular.copy($stateParams), {
                        reload: true,
                        inherit: true,
                        notify: true
                    })
                };
                reload();
                $timeout(reload, 100);
            };
            return $delegate;
        }]);

Tudo falhou para mim. A única coisa que funcionou ... foi adicionar cache-view = "false" à visualização que eu quero recarregar quando for a ela.

desta edição https://github.com/angular-ui/ui-router/issues/582

Não sei por que nada disso parecia funcionar para mim; o que finalmente fez foi:

$state.reload($state.current.name);

Isso foi com o Angular 1.4.0

Eu tinha várias visualizações aninhadas e o objetivo era recarregar apenas uma com conteúdo. Tentei abordagens diferentes, mas a única coisa que funcionou para mim é:

//to reload
$stateParams.reload = !$stateParams.reload; //flip value of reload param
$state.go($state.current, $stateParams);

//state config
$stateProvider
  .state('app.dashboard', {
    url: '/',
    templateUrl: 'app/components/dashboard/dashboard.tmpl.html',
    controller: 'DashboardController',
    controllerAs: 'vm',
    params: {reload: false} //add reload param to a view you want to reload
  });

Nesse caso, apenas a visualização necessária seria recarregada e o cache ainda funcionaria.

Sei que há várias respostas, mas a melhor maneira de fazer isso sem causar uma atualização completa da página é criar um parâmetro fictício na rota que desejo atualizar e, quando chamo a rota, passo uma número aleatório para o parâmetro fictício.

            .state("coverage.check.response", {
                params: { coverageResponse: null, coverageResponseId: 0, updater: 1 },
                views: {
                    "coverageResponse": {
                        templateUrl: "/Scripts/app/coverage/templates/coverageResponse.html",
                        controller: "coverageResponseController",
                        controllerAs: "vm"
                    }
                }
            })

e então a chamada para essa rota

$state.go("coverage.check.response", { coverageResponse: coverage, updater: Math.floor(Math.random() * 100000) + 1 });

Funciona como um encanto e lida com as resoluções.

Você pode usar a resposta de @Rohan https://stackoverflow.com/a/23609343/3297761

Mas se você quiser fazer com que cada controlador seja carregado após uma alteração de exibição, você pode usar

myApp.config(function($ionicConfigProvider) { $ionicConfigProvider.views.maxCache(0); ... }

Se você estiver usando o ionic v1, a solução acima não funcionará, pois o ionic ativou o cache de modelos como parte do $ ionicConfigProvider.

A solução para isso é um pouco hacky - você deve definir o cache como 0 no arquivo ionic.angular.js:

$ionicConfigProvider.views.maxCache(0);

Eu tive esse problema que estava destruindo minha cabeça, meu roteamento é lido a partir de um arquivo JSON e, em seguida, alimentado em uma diretiva. Eu poderia clicar em um estado da interface do usuário, mas não consegui recarregar a página. Então, um colega meu me mostrou um pequeno truque para isso.

1. Obtenha seus dados
2. Na configuração de seus aplicativos, crie um estado de carregamento
3. Salve o estado que você deseja ir no rootcope.
4. Defina sua localização como "/ loading" no seu app.run
5. No controlador de carregamento, resolva a promessa de roteamento e defina o local para o destino pretendido.

Isso funcionou para mim.

Espero que ajude