AngularJs: Odśwież stronę

<a ng-href="#" class="navbar-brand" title="home" data-translate>PORTAL_NAME</a>

Chcę ponownie załadować stronę. W jaki sposób mogę to zrobić?

Możesz skorzystać z reloadmetody $routeusługi. Wprowadzić $routew kontrolerze, a następnie utworzyć metodę reloadRoutena własną $scope.

$scope.reloadRoute = function() {
   $route.reload();
}

Następnie możesz użyć go na linku w ten sposób:

<a ng-click="reloadRoute()" class="navbar-brand" title="home"  data-translate>PORTAL_NAME</a>

Ta metoda spowoduje ponowne załadowanie aktualnej trasy. Jeśli jednak chcesz wykonać pełne odświeżenie, możesz wstrzyknąć $windowi użyć tego:

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

Późniejsza edycja (ui-router):

Jak wspomnieli JamesEddyEdwards i Dunc w swoich odpowiedziach, jeśli używasz angular -ui / ui-router , możesz użyć następującej metody, aby ponownie załadować bieżący stan / trasę. Po prostu wstrzyknij $statezamiast, $routea otrzymasz:

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

windowobiekt jest udostępniany za pośrednictwem $windowserwisu w celu łatwiejszego testowania i mockowania , możesz skorzystać z czegoś takiego:

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

I :

<a ng-click="reloadPage"  class="navbar-brand" title="home"  data-translate>PORTAL_NAME</a>

Na marginesie, nie sądzę, aby $ route.reload () faktycznie przeładowywała stronę, ale tylko trasę .

 location.reload(); 

Zrób sztuczkę.

<a ng-click="reload()">

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

Nie potrzebujesz tras ani niczego po prostu starego js

Podobny do odpowiedzi Alexandrina, ale używający $ state zamiast $ route:

(Z odpowiedzi SO JimTheDev tutaj .)

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

<a ng-click="reloadState()" ... 

Jeśli używasz bardziej zaawansowanego routera Angulars, który zdecydowanie polecam, możesz teraz po prostu użyć:

$state.reload();

Co zasadniczo robi to samo, co odpowiedź Dunca.

Moim rozwiązaniem, aby uniknąć nieskończonej pętli, było utworzenie innego stanu, który spowodował przekierowanie:

$stateProvider.state('app.admin.main', {
    url: '/admin/main',
    authenticate: 'admin',
    controller: ($state, $window) => {
      $state.go('app.admin.overview').then(() => {
        $window.location.reload();
      });
    }
  });

Angular 2+

Znalazłem to podczas wyszukiwania Angular 2+, więc oto sposób:

$window.location.reload();

Wystarczy go użyć $route.reload()(nie zapomnij wstrzyknąć $ route do kontrolera), ale z Twojego przykładu możesz po prostu użyć „href” zamiast „ng-href”:

<a href=""  class="navbar-brand" title="home"  data-translate>PORTAL_NAME</a>

Wystarczy użyć ng-href, aby chronić użytkownika przed nieprawidłowymi linkami spowodowanymi kliknięciem, zanim Angular zastąpi zawartość tagów {{}}.

Na Angular 1.5 - po wypróbowaniu niektórych z powyższych rozwiązań chcących przeładować tylko dane bez pełnego odświeżania strony, miałem problemy z poprawnym załadowaniem danych. Zauważyłem jednak, że kiedy jadę na inną trasę, a potem wracam do obecnego, wszystko działa dobrze, ale gdy chcę tylko przeładować bieżącą trasę używając $route.reload(), to część kodu nie jest poprawnie wykonywana. Następnie próbowałem przekierować na aktualną trasę w następujący sposób:

$scope.someFuncName = function () {
    //go to another route
    $location.path('/another-route');
};

aw konfiguracji modułu dodaj kolejny when:

.config(['$routeProvider', function($routeProvider) {
     $routeProvider.when('/first-page', {
         templateUrl: '/first-template',
         controller: 'SomeCtrl'
     }).when('/another-route', {//this is the new "when"
         redirectTo: '/first-page'
     });
}])

i dla mnie działa dobrze. Nie odświeża całej strony, a jedynie powoduje ponowne załadowanie bieżącego kontrolera i szablonu. Wiem, że to trochę zepsute, ale to było jedyne rozwiązanie, jakie znalazłem.

<a title="Pending Employee Approvals" href="" ng-click="viewPendingApprovals(1)">
                    <i class="fa fa-user" aria-hidden="true"></i>
                    <span class="button_badge">{{pendingEmployeeApprovalCount}}</span>
                </a>

i w kontrolerze

 $scope.viewPendingApprovals = function(type) {
                if (window.location.hash.substring(window.location.hash.lastIndexOf('/') + 1, window.location.hash.length) == type) {
                    location.reload();
                } else {
                    $state.go("home.pendingApproval", { id: sessionStorage.typeToLoad });
                }
            };

oraz w pliku trasy

.state('home.pendingApproval', {
        url: '/pendingApproval/:id',
        templateUrl: 'app/components/approvals/pendingApprovalList.html',
        controller: 'pendingApprovalListController'
    })

Tak więc, jeśli identyfikator przekazany w adresie URL jest taki sam, jak ten, który pochodzi z funkcji wywołanej przez kliknięcie kotwicy, po prostu załaduj ponownie, w przeciwnym razie podążaj za żądaną trasą.

Proszę, pomóż mi ulepszyć tę odpowiedź, jeśli to pomaga. Wszelkie sugestie są mile widziane.

Można to zrobić, wywołując metodę reload () obiektu window w zwykłym języku JavaScript

window.location.reload();

Proponuję odnieść się do strony. Oficjalna sugestia

https://docs.angularjs.org/guide/$location

Można to zrobić, wywołując metodę reload () w JavaScript.

location.reload();