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

基于多个用户上下文呈现整个页面并发出多个

$http

请求后，我希望用户能够切换上下文并重新呈现所有内容（重新发送所有

$http

请求等）。如果我只是将用户重定向到其他地方，则一切正常：

$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（））

也不起作用（什么也没发生）

---

是否有其他方法可以在不再次手动发出所有请求的情况下重新呈现页面？

对于记录，要强制angular重新呈现当前页面，可以使用：

$route.reload();

$window.location.reload();

根据AngularJS的说法：

导致$route服务重新加载当前路由，即使$location未更改

因此，ngView创建新的作用域，重新实例化控制器

---

对于为给定路由路径重新加载页面：-

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

---

可能您在声明控制器的依赖项时忘记添加“$route”：

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

$route.reload（）

将重新初始化控制器，但不会初始化服务。如果要重置应用程序的整个状态，可以使用：

$route.reload();

$window.location.reload();

这是一个您可以访问的服务

如果您希望确保从服务器重新加载页面，例如，当您使用Django或其他web框架时，并且希望使用新的服务器端渲染，请将

true

作为参数传递到

reload

，如中所述。因为这需要与服务器交互，所以速度会慢一些，所以只有在必要时才这样做

角度2

---

上述内容适用于角度1。我没有使用Angular 2，看起来那里的服务不同，有

路由器

，

位置

，还有

文档

。我没有在那里测试不同的行为

我与这个问题进行了数月的艰苦斗争，唯一对我有效的解决方案是：

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

---

要重新加载所有内容，请使用window.location.reload（）；和angularjs

查看工作示例

HTML

---

我认为最简单的解决办法是

将“/”添加到每次返回时都要重新加载的路由

例如：

而不是下面的

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

使用

---

在不通知用户的情况下使用以下代码。它将呈现页面

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

---

如果要在刷新正在使用的任何服务时刷新控制器，可以使用以下解决方案：

• 注入$state

i、 e

---

这将刷新控制器和HTML。如果您使用的是angular ui router，您可以将其称为刷新或重新渲染

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

---

我得到了删除缓存和重新加载页面的工作代码

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

查看

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

角度2之前（角度js）

直达路线

$route.reload();

如果您想重新加载整个应用程序

$window.location.reload();

角度2+

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

constructor(private location: Location) {}

ngOnInit() {  }

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

或

---

请尝试以下操作之一：

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

---

感谢您的评论，由于某些原因，当我使用

$route.reload（）

时，与正常刷新相比，我的行为似乎略有不同。例如，选项卡设置为在刷新时最初显示，但当重新加载方法似乎在不设置选项卡的情况下重新加载页面时，不确定问题出在哪里。这是否也运行筛选器/服务？正在获取不需要的持久状态。编辑：仍然投票支持正确回答问题&这非常有帮助。感谢您的记忆将

$route

注入控制器以使其工作。@alphapilgrim ngRoute模块不再是core

angular.js文件的一部分。如果您继续使用
$routeProvider
，那么您现在需要在HTML中包含
angular route.js
：state.reload（），如果您使用StateProvider不知道为什么，但是.reload（）方法在这里似乎不起作用。它并没有实现任何功能。值得注意的是，人们不应该为了要求服务“重新启动”而在服务中存储状态。谁这么说？应该在哪里存储缓存数据？由于数据存储在服务中，使它们成为有状态的而不是无状态的，我偶然发现了很多错误。除非我们谈论的是缓存服务（在这种情况下，将有一个接口来刷新它），否则我会将数据保留在服务之外和控制器中。例如，可以将数据保存在本地存储中，并使用服务访问它。这将使服务不再直接在其中保存数据。@danza缓存数据应该存储在哪里。。。模型对象？然而，Angular在给MVC成员命名方面做得很糟糕。我通过module.value API保留可注入模型对象。然后，我在ng服务上定义的改变模型对象的各种API工作起来更像命令。当然，这会起作用，但这不是好的实践。请看，使用它的原因在一开始就解释了：虽然窗口在JavaScript中是全局可用的，但它会导致可测试性问题，因为它是一个全局变量。在angular中，我们总是通过$window服务引用它，因此它可能会被覆盖、删除或模拟以进行测试。这与OP特别提到的执行
$window.location.reload（）
几乎没有什么不同。@PardeepJain这对我来说很有效。这就是为什么这是一个答案。你对我的答案投了反对票吗？不，一点也不，你的答案投反对票也不错。令人惊讶的是，我现在不知道为什么同样的方法在angular2中对我不起作用。完美的解决方案。太棒了！即使您的原始路径是应用程序的根，这也可以工作-
/
：O我的路线现在看起来是这样的：
/
在Angular 6中，它在使用后工作#同样也可以用于Angular2。想想看
import { Location } from '@angular/common';

constructor(private location: Location) {}

ngOnInit() {  }

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

constructor(private location: Location) {}

ngOnInit() {  }

Methods (){
    this.ngOnInit();
}

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