AngularJs: Reload page

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

I want to reload the page. How can I do this?

403634 次浏览

您可以使用 $route服务的 reload方法。在控制器中注入 $route,然后在 $scope上创建一个方法 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 在他们的回答中提到的,如果您使用 角路由器角路由器,您可以使用以下方法来重新加载当前状态/路由。只要注入 $state而不是 $route,你就会得到:

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

使用 $route.reload()很容易(不要忘记在控制器中注入 $path) ,但是从您的示例中可以只使用“ href”而不是“ ng-href”:

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

在 Angular 替换\{\{}}标记的内容之前,您只需要使用 ng-href 保护用户免受由于单击而导致的无效链接的影响。

window对象是通过 $window服务为 更容易测试和嘲弄提供的,您可以使用这样的东西:

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

还有:

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

顺便说一句,我不认为 $route.reload ()实际上会重新加载页面,而是 只有路线

与 Alexandrin 的回答类似,但使用 $state 而不是 $path:

(来自 JimTheDev 的回答 给你)

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


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

如果使用更先进的角度 路由器,我一定会推荐,那么你现在可以简单地使用:

$state.reload();

这和 Dunc 的答案是一样的。

 location.reload();

有用。

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


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

不需要路线什么的,只要普通的 Js

在 Angular 1.5上,我尝试了上面的一些解决方案,希望只重新加载数据而不刷新整个页面,我在正确加载数据方面遇到了问题。但是我注意到,当我转到另一个路由,然后返回到当前路由时,一切都很正常,但是当我只想使用 $route.reload()重新加载当前路由时,一些代码没有正确执行。然后我尝试用下面的方法重定向到当前的路线:

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

在模块配置中,添加另一个 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'
});
}])

我觉得挺好的。它不会刷新整个页面,而只会导致重新加载当前控制器和模板。我知道这有点粗糙,但这是我找到的唯一解决办法。

<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 与通过单击锚点调用的函数所传递的 id 相同,那么只需重新加载,否则按照请求的路由。

请帮助我改进这个答案,如果有帮助的话。欢迎任何建议。

我避免无限循环的解决方案是创建另一个进行了重定向的状态:

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

角度2 +

我是在搜索 Angular 2 + 的时候发现这个的,所以方法是这样的:

$window.location.reload();

这可以通过在纯 JavaScript 中调用 window 对象的 reload ()方法来实现

window.location.reload();

我建议参考这一页,官方建议

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

enter image description here

这可以通过在 JavaScript 中调用 reload ()方法来完成。

location.reload();