AngularJs：重新加载页面

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

我想重新加载页面。 我该怎么做？

Answer 1

您可以使用$route服务的reload方法。 在你的控制器中注入$route ，然后在你的$scope创build一个reloadRoute方法。

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

那么你可以在这样的链接上使用它：

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

此方法将导致当前路线重新加载。 如果你想要执行完整的刷新，你可以注入$window并使用它：

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

稍后编辑（ui-router）：

正如JamesEddyEdwards和Dunc在他们的回答中提到的那样，如果您正在使用angular-ui / ui-router ，则可以使用以下方法重新加载当前的状态/路由。 只要注入$state而不是$route ，然后你有：

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

Answer 2

window对象可以通过$window服务获得， 以便于testing和嘲笑 ，你可以使用如下的东西：

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

和：

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

作为一个方面说明，我不认为$ route.reload（）实际上重新加载页面，但只有路线 。

Answer 3

类似于Alexandrin的回答，但使用$ state而不是$ route：

（从JimTheDev的答案在这里 。）

 $scope.reloadState = function() { $state.go($state.current, {}, {reload: true}); } <a ng-click="reloadState()" ... 

Answer 4

  location.reload(); 

诀窍吗？

 <a ng-click="reload()"> $scope.reload = function() { location.reload(); } 

没有必要的路线或任何东西只是普通的老js

Answer 5

如果使用Angulars更先进的UI路由器 ，我肯定会build议你现在可以简单地使用：

 $state.reload(); 

这基本上和Dunc的答案一样。

Answer 6

避免无限循环的解决scheme是创build另一个redirect的状态：

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

Answer 7

使用$route.reload() （不要忘了将$ route注入到你的控制器中），但是从你的例子中你可以使用“href”而不是“ng-href”：

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

您只需要使用ng-href来保护用户免受Angular已经replace{{}}标签内容之前点击造成的无效链接。

Answer 8

在Angular 1.5中 – 尝试了一些上面的解决scheme想要重新加载只有数据没有完整页面刷新后，我有正确加载数据的问题。 我注意到，虽然，当我去另一个路线，然后我回到当前，一切工作正常，但是当我只想使用$route.reload()重新加载当前路线，那么一些代码不会执行正常。 然后我尝试按照以下方式redirect到当前路由：

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

并在模块configuration中添加另一个：

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

对我来说工作得很好 它不刷新整个页面，但只会导致当前控制器和模板重新加载。 我知道这有点冒险，但这是我find的唯一解决scheme。

Answer 9

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

并在控制器中

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

并在路由文件中

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

所以，如果在URL中传递的id与从通过单击锚点调用的函数来的相同，那么只需重新加载，否则继续请求的路线。

请帮助我改进这个答案，如果这是帮助。 任何build议，欢迎。