AngularJs: перезавантажити сторінку

<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-роутер):

Як згадували 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 () фактично перезавантажує сторінку, а лише маршрут .

 location.reload(); 

Чи трюк.

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

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

Немає потреби в маршрутах і в чомусь просто звичайному старому js

Схожа на відповідь Олександріна, але використовуючи $ state, а не $ route:

(З відповіді ДжимТеДева тут .)

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

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

Якщо ви використовуєте 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'
     });
}])

і це працює чудово для мене. Це не оновлює всю сторінку, а лише викликає перезавантаження поточного контролера та шаблону. Я знаю, що це трохи хакі, але це було єдине рішення, яке я знайшов.

<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

window.location.reload();

Я б запропонував переглянути сторінку. Офіційна пропозиція

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

Це можна зробити, викликавши метод reload () в JavaScript.

location.reload();