2014-02-19 22 views

Antwort

242

Sie können die reload-Methode des $route-Dienstes verwenden. Inject $route in Ihrem Controller und dann erstellen Sie eine Methode reloadRoute auf Ihrem $scope.

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

Dann können Sie es auf den Link wie diesen:

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

Diese Methode wird die aktuelle Route führt erneut zu laden. Wenn Sie jedoch eine vollständige Aktualisierung durchführen möchten, können Sie $window injizieren und verwenden, die:

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


Später bearbeiten (ui-Router):

Wie JamesEddyEdwards und Dunc erwähnt in ihre Antworten, wenn Sie angular-ui/ui-router verwenden, können Sie die folgende Methode verwenden, um den aktuellen Status/Route neu zu laden. injizieren nur $state statt $route und dann haben Sie:

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

Dies ist eine gute Antwort, wenn Sie verzweifelt sind die Reload Angularise. – spikeheap

+0

Wie kann ich dieses Verhalten global ändern, anstatt eine Aktion zu allen Links hinzuzufügen? – OMGPOP

+0

@OMGPOP Was genau meinen Sie global für alle Links? –

1

Es ist leicht genug, um nur $route.reload() zu verwenden (nicht vergessen, $ Route in Ihrem Controller zu injizieren), sondern von Ihrem Beispiel verwenden Sie könnten nur „href“ anstelle von „ng-href“:

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

Sie brauchen nur ng-href verwenden, um den Benutzer von ungültigen Links von ihnen verursacht zu schützen klicken, bevor Angular den Inhalt der {{}} Tags ersetzt.

+0

$ route ist Teil von ng.route.IRouteService ?? – cracker

42

window Objekt wird durch $window Service für easier testing and mocking zur Verfügung gestellt, um Ihnen so etwas wie gehen:

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

Und:

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

Als Randbemerkung, ich glaube nicht, $ route .reload() lädt die Seite tatsächlich neu, aber only the route.

+2

Ich empfehle '$ window' anstelle von' window' zu verwenden. – Jeroen

+0

Danke für Ihren Beitrag. Würdest du uns erklären warum? –

+1

Ja, tut mir leid. Am besten erklärt man es durch die [$ window_docs] (https://docs.angularjs.org/api/ng/service/$window), hauptsächlich weil 'reloadPage' (besser) testbar wäre, wenn' $ verwendet wird Fenster ". – Jeroen

13

ähnlich Alexandrin Antwort, aber $ Zustand statt $ Route mit:

(Von JimTheDev-SO here beantworten.)

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

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

Bei der Verwendung von winkelförmigen Stangen fortgeschritteneren ui-router was ich auf jeden Fall dann würde empfehlen Sie können jetzt einfach verwenden:

$state.reload(); 

Das ist im Wesentlichen dasselbe wie die Antwort von Dunc.

12
location.reload(); 

Macht den Trick.

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

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

Keine Notwendigkeit für Routen oder etwas einfach nur alte js

+2

liebe die Einfachheit! –

+0

Danke, es ist einfach und funktioniert für mich. –

1

Auf Angular 1,5 - nach Wunsch einige der oben genannten Lösungen versuchen, nur die Daten ohne vollständige Aktualisierung der Seite neu zu laden, ich mit dem Laden Probleme hatte die Daten richtig. Mir ist jedoch aufgefallen, dass wenn ich auf eine andere Route gehe und ich dann zurück zum Strom gehe, alles gut geht, aber wenn ich nur die aktuelle Route mit $route.reload() neu laden will, dann wird ein Teil des Codes nicht richtig ausgeführt. Dann habe ich versucht, die aktuelle Route auf folgende Weise zu umleiten:

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

und im Modul Config, fügen Sie eine andere 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' 
    }); 
}]) 

und es funktioniert nur für mich in Ordnung. Es aktualisiert nicht die gesamte Seite, sondern bewirkt nur, dass der aktuelle Controller und die Vorlage neu geladen werden. Ich weiß, dass es ein bisschen hacky ist, aber das war die einzige Lösung, die ich gefunden habe.

1
<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> 

und in der Steuerung

$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 }); 
       } 
      }; 

und in der Routendatei

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

Also, wenn die ID in der URL übergeben wird, gleiche wie das, was von der Funktion durch genannt kommt Klicken Sie auf den Anker, dann einfach neu laden, sonst folgen Sie der gewünschten Route.

Bitte helfen Sie mir, diese Antwort zu verbessern, wenn das hilft. Irgendwelche, Vorschläge sind willkommen.

+0

Ich brauchte einen Monat, um herauszufinden, warum die Seite nicht neu geladen wird – sam

2

Meine Lösung, um die Endlosschleife zu vermeiden, wurde ein anderer Staat zu schaffen, der die Umleitung gemacht haben:

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