Jak ponownie załadować lub zrenderować całą stronę za pomocą AngularJS

Po renderowaniu całej strony w oparciu o kilka kontekstów użytkownika i po złożeniu kilku $httpżądań chcę, aby użytkownik mógł przełączać konteksty i ponownie renderować wszystko ponownie (ponownie wysyłać wszystkie $httpżądania itp.). Jeśli po prostu przekieruję użytkownika w inne miejsce, wszystko działa poprawnie:

$scope.on_impersonate_success = function(response) {
  //$window.location.reload(); // This cancels any current request
  $location.path('/'); // This works as expected, if path != current_path
};

$scope.impersonate = function(username) {
  return auth.impersonate(username)
    .then($scope.on_impersonate_success, $scope.on_auth_failed);
};

Jeśli użyję $window.location.reload(), niektóre z $httpżądań auth.impersonate(username)oczekujących na odpowiedź zostaną anulowane, więc nie mogę tego użyć. Hack $location.path($location.path())też nie działa (nic się nie dzieje).

Czy istnieje inny sposób ponownego renderowania strony bez ręcznego wydawania wszystkich żądań?

W celu wymuszenia kątowego ponownego renderowania bieżącej strony można użyć:

$route.reload();

Zgodnie z dokumentacją AngularJS :

Powoduje, że usługa trasy $ ponownie ładuje bieżącą trasę, nawet jeśli $ lokalizacja się nie zmieniła.

W wyniku tego ngView tworzy nowy zakres, przywraca kontroler.

$route.reload()ponownie zainicjuje kontrolerów, ale nie usługi. Jeśli chcesz zresetować cały stan aplikacji, możesz użyć:

$window.location.reload();

Jest to standardowa metoda DOM, do której można uzyskać dostęp wstrzykując usługę $ window .

Jeśli chcesz mieć pewność, że strona zostanie ponownie załadowana z serwera, na przykład, gdy używasz Django lub innej platformy WWW i chcesz zrenderować stronę po stronie serwera, przekaż truejako parametr do reload, jak wyjaśniono w dokumentacji . Ponieważ wymaga to interakcji z serwerem, będzie wolniej, więc rób to tylko w razie potrzeby

Kątowy 2

Powyższe odnosi się do kątowego 1. Nie używam kątowa 2, wygląda jak usługi różnią się tam znajduje Router, Locationoraz DOCUMENT. Nie testowałem tam różnych zachowań

Aby ponownie załadować stronę dla danej ścieżki trasy: -

$location.path('/path1/path2');
$route.reload();

Jeśli korzystasz z kątowego interfejsu użytkownika routera, będzie to najlepsze rozwiązanie.

$scope.myLoadingFunction = function() {
    $state.reload();
};

Być może zapomniałeś dodać „$ route”, deklarując zależności kontrolera:

app.controller('NameCtrl', ['$scope','$route', function($scope,$route) {   
   // $route.reload(); Then this should work fine.
}]);

Aby przeładować wszystko, użyj window.location.reload (); z angularjs

Sprawdź działający przykład

HTML

<div ng-controller="MyCtrl">  
<button  ng-click="reloadPage();">Reset</button>
</div>

angularJS

var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {
    $scope.reloadPage = function(){window.location.reload();}
}

http://jsfiddle.net/HB7LU/22324/

Jeśli chcesz odświeżyć kontroler podczas odświeżania używanych usług, możesz użyć tego rozwiązania:

• Wstaw stan $

to znaczy

app.controller('myCtrl',['$scope','MyService','$state', function($scope,MyService,$state) {

    //At the point where you want to refresh the controller including MyServices

    $state.reload();

    //OR:

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

Spowoduje to odświeżenie kontrolera i HTML, a także możesz nazwać to Odśwież lub Ponownie renderuj .

Przed Angular 2 (AngularJs)

Trasa

$route.reload();

Jeśli chcesz ponownie załadować całą aplikację

$window.location.reload();

Angular 2+

import { Location } from '@angular/common';

constructor(private location: Location) {}

ngOnInit() {  }

load() {
    this.location.reload()
}

Lub

constructor(private location: Location) {}

ngOnInit() {  }

Methods (){
    this.ngOnInit();
}

Najłatwiejszym rozwiązaniem, jakie wymyśliłem, było

dodaj „/” do trasy, która ma zostać przeładowana za każdym razem, gdy wracasz.

na przykład:

zamiast następujących

$routeProvider
  .when('/About', {
    templateUrl: 'about.html',
    controller: 'AboutCtrl'
  })

posługiwać się,

$routeProvider
  .when('/About/', { //notice the '/' at the end 
    templateUrl: 'about.html',
    controller: 'AboutCtrl'
  })

Spróbuj wykonać jedną z następujących czynności:

$route.reload(); // don't forget to inject $route in your controller
$window.location.reload();
location.reload();

Mam ten działający kod do usuwania pamięci podręcznej i ponownego ładowania strony

Widok

        <a class="btn" ng-click="reload()">
            <i class="icon-reload"></i> 
        </a>

Kontroler

Wtryskiwacze: $ scope, $ state, $ stateParams, $ templateCache

       $scope.reload = function() { // To Reload anypage
            $templateCache.removeAll();     
            $state.transitionTo($state.current, $stateParams, { reload: true, inherit: true, notify: true });
        };

Użyj następującego kodu bez poufnego powiadomienia o ponownym załadowaniu do użytkownika. Wyrenderuje stronę

var currentPageTemplate = $route.current.templateUrl;
$templateCache.remove(currentPageTemplate);
$window.location.reload();

Od miesięcy mam ciężką walkę z tym problemem, a jedynym rozwiązaniem, które mi się udało, jest:

var landingUrl = "http://www.ytopic.es"; //URL complete
$window.location.href = landingUrl;