如何使用AngularJS重新加载或重新呈现整个页面

在基于几个用户上下文呈现整个页面并且创build了几个$http请求之后,我希望用户能够切换上下文并重新呈现所有内容(重新发送所有$http请求等)。 如果我只是将用户redirect到其他地方,事情就能正常工作:

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

如果我使用$window.location.reload() ,那么等待响应的auth.impersonate(username)上的一些$http请求被取消,所以我不能使用它。 另外,hack $location.path($location.path())也不起作用(没有任何反应)。

有没有另外的方式来重新呈现页面,而无需再次手动发出所有请求?

为了logging,强制angular度重新呈现当前页面,您可以使用:

 $route.reload(); 

根据AngularJS 文档 :

导致$ route service重新加载当前路由,即使$ location没有改变。

因此,ngView创build新的范围,重新实现控制器。

$route.reload()将重新初始化控制器,但不是服务。 如果你想重置你的应用程序的整个状态,你可以使用:

 $window.location.reload(); 

这是一个标准的DOM方法 ,您可以访问注入$ window服务。

如果您想确保从服务器重新加载页面,例如当您使用Django或其他Web框架,并且您想要一个新的服务器端呈现,请传递true作为参数reload ,如文档中所述 。 因为这需要与服务器进行交互,所以它会比较慢,所以只有在必要的时候才可以

angular2

以上适用于Angular 1.我不使用Angular 2,看起来像那里的服务是不同的,有RouterLocationDOCUMENT 。 我没有在那里testing不同的行为

重新加载给定路由path的页面: –

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

那么也许你忘了在声明你的Controller的依赖时添加“$ route”:

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

如果您使用angular度ui路由器这将是最好的解决scheme。

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

只要重新加载一切,使用window.location.reload(); 与angularjs

查看工作示例

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/

我认为最简单的解决scheme是,

每次回来的时候都要join'/'到想要重载的路由。

例如:

而不是以下

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

使用,

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

如果要刷新控制器,同时刷新正在使用的任何服务,则可以使用此解决scheme:

  • 注入$状态

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

这将刷新控制器和HTML,你可以称之为刷新或重新渲染

我得到这个工作代码,以删除caching和重新加载页面

视图

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

调节器

注入器: $ scope,$ state,$ stateParams,$ templateCache

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

使用下面的代码,无需向用户重新加载通知。 它将呈现该页面

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

几个月来,我一直在努力解决这个问题,唯一能解决这个问题的scheme是:

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