<a ng-href="#" class="navbar-brand" title="home" data-translate>PORTAL_NAME</a>
Я хочу перезагрузить страницу. Как я могу это сделать?
<a ng-href="#" class="navbar-brand" title="home" data-translate>PORTAL_NAME</a>
Я хочу перезагрузить страницу. Как я могу это сделать?
Ответы:
Вы можете использовать reload
метод $route
сервиса. Введите $route
в свой контроллер, а затем создайте метод reloadRoute
на своем $scope
.
$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();
};
window
Объект сделан доступным через $window
сервис для облегчения тестирования и насмешек , вы можете пойти с чем-то вроде:
$scope.reloadPage = function(){$window.location.reload();}
И :
<a ng-click="reloadPage" class="navbar-brand" title="home" data-translate>PORTAL_NAME</a>
Как примечание, я не думаю, что $ route.reload () на самом деле перезагружает страницу, а только маршрут .
$window
вместо window
.
$window
документации , в основном это потому , что reloadPage
было бы (лучше) проверяемым , когда он использует $window
.
location.reload();
Делает трюк.
<a ng-click="reload()">
$scope.reload = function()
{
location.reload();
}
Не нужны маршруты или что-то еще, просто старый js
Если вы используете более продвинутый ui-маршрутизатор Angulars, который я определенно рекомендую, теперь вы можете просто использовать:
$state.reload();
Что по сути делает то же самое, что и ответ Дунк.
Мое решение избежать бесконечного цикла состояло в том, чтобы создать другое состояние, в котором было выполнено перенаправление:
$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();
Его достаточно просто использовать $route.reload()
(не забудьте ввести $ route в ваш контроллер), но из вашего примера вы можете просто использовать «href» вместо «ng-href»:
<a href="" class="navbar-brand" title="home" data-translate>PORTAL_NAME</a>
Вам нужно только использовать ng-href, чтобы защитить пользователя от недействительных ссылок, вызванных их щелчком до того, как Angular заменил содержимое тегов {{}}.
На 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'
});
}])
и это прекрасно работает для меня. Он не обновляет всю страницу, а только вызывает перезагрузку текущего контроллера и шаблона. Я знаю, что это немного глупо, но это было единственное решение, которое я нашел.
var reload = $location.url(); $location.url(''); $timeout(function() { $location.url(reload); });
; не нужно создавать случайные маршруты. Но было бы интересно посмотреть, какой код не переоценивает для вас. Похоже, что даже redirectTo
s и resolve
функции повторно выполняются в обычном режиме$route.reload()
(см. Console.log).
<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-адресе, совпадает с тем, что исходит от функции, вызываемой щелчком якоря, просто перезагрузите, иначе следуйте запрошенному маршруту.
Пожалуйста, помогите мне улучшить этот ответ, если это поможет. Любые, предложения приветствуются.
Это можно сделать, вызвав метод reload () в JavaScript.
location.reload();