AngularJs: страница перезагрузки

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

Я хочу перезагрузить страницу. Как я могу это сделать?

Ответ 1

Вы можете использовать метод reload службы $route. Inject $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();
};

Ответ 2

window объект доступен через $window сервис для более легкого тестирования и издевательств, вы можете пойти с чем-то вроде:

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

И:

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

В качестве побочного примечания я не думаю, что $route.reload() фактически перезагружает страницу, но только маршрут.

Ответ 3

 location.reload(); 

Есть трюк.

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

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

Нет необходимости в маршрутах или что-то просто старое js

Ответ 4

Как и Александрин, ответьте, но используя $state, а не $route:

(Из JimTheDev SO ответьте здесь.)

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

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

Ответ 5

Если использовать Angulars более продвинутые ui-router, которые я бы рекомендовал, вы теперь можете просто использовать:

$state.reload();

Что по сути делает то же самое, что и ответ Dunc.

Ответ 6

Мое решение избежать бесконечного цикла состояло в создании другого состояния, которое сделало перенаправление:

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

Ответ 7

Достаточно просто использовать $route.reload() (не забудьте ввести $route в ваш контроллер), но из вашего примера вы можете просто использовать "href" вместо "ng-href":

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

Вам нужно только использовать ng-href для защиты пользователя от недействительных ссылок, вызванных ими, прежде чем Angular заменит содержимое тегов {{}}.

Ответ 8

В 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'
     });
}])

и он отлично подходит для меня. Он не обновляет всю страницу, а только вызывает перезагрузку текущего контроллера и шаблона. Я знаю, что это немного хаки, но это единственное решение, которое я нашел.

Ответ 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-адресе, аналогичен тому, что исходит от функции, вызванной нажатием на якорь, а затем просто перезагрузите, иначе следуйте запрошенному маршруту.

Пожалуйста, помогите мне улучшить этот ответ, если это поможет. Любые предложения приветствуются.

Ответ 10

Угловой 2+

Я нашел это во время поиска Angular 2+, поэтому вот путь:

window.location.reload();