Перезагрузка страницы на FF без изменения страницы

У меня есть эта проблема, что я не могу понять, что происходит: Я использую Angular и механизм маршрутизации.

поэтому у меня есть url:

<a href="#/videos/detail/{{video.Id}}" onclick="location.reload();">
    <div class="card-image">
        <img ng-src="{{video.ThumbnailUrl?video.ThumbnailUrl:'img/images.png'}}" src="" />
    </div>
</a>

Как вы видите, существует onclick="location.reload();, это работает на Chrome и IE9. Но на FF он делает следующее:

  • Нажмите ссылку
  • URL обновляется
  • Вызывается ссылка location.reload(), вызываемая страницей.
  • Представление URL и Angular, вернитесь к странице, на которую нажата ссылка.
  • При нажатии "F5" фактическая страница и URL-адрес загружаются в

Я также пробовал сделать location.reload(true);, если, возможно, маршрут был кеширован или нет, но не повезло.

В случае, если вам интересно, почему обновление и местоположение: Мне нужно обновить страницу для перезагрузки плагина (из-за ошибки в нем), и этот метод был первым, о котором я мог подумать.

EDIT: В конце концов, сделав комбинацию Angular и некоторого JQuery;

Итак, последний html выглядел так:

<a href="#" class="prevent" ng-click="redirectwithreload('# />videos/detail/'+video.Id)" >
    <div class="card-image">
        <img ng-src="{{video.ThumbnailUrl?video.ThumbnailUrl:'img/images.png'}}" src="" />
    </div>
</a>

Директива выглядела так:

.directive('videoCard', function () {
    return {
        restrict: 'E',
        templateUrl: 'partials/directives/video-card.html',
        controller: function ($scope, $element, $location) {
            $scope.redirectWithReload = function (url) {
                var toUrl = location.href.split('#')[0] + url;
                location.replace(toUrl);
            }
        },
        compile: function () {
            return {
                post: function () {
                    $('a.prevent').click(function (e) {
                        e.preventDefault();
                    });
                }
            }
        }
    };
})

класс prevent был только для моего Jquery, чтобы предотвратить дефолт и пошел за ng-кликом, из-за того, что мне когда-либо понадобится добавить больше urars в url, теперь это очень легко сделать:)

Спасибо за помощь! особенно: @mplungjan

Ответ 1

Если вы храните идентификатор в атрибуте и используете замену, вы можете сделать

<a href="#" id="{{video.I‌​d}}"
onclick="location.replace(location.href.split('#')[0]+'#/videos/detail/'+this.id‌​); return false"> 

или для пуриста (здесь jQuery, я не делаю Angular):

<a href="#" class="vids" id="{{video.I‌​d}}"> 

используя

$(function() {
  $(".vids").on("click",function(e) {
    e.preventDefault();
    location.replace(location.href.split('#')[0]+'#/videos/detail/'+this.id‌​); "
  });
});

Дополнительные параметры:

<a href="#" class="vids" data-id="{{video.I‌​d}}" data-target="somewhere"> 

используя

$(function() {
  $(".vids").on("click",function(e) {
    e.preventDefault();
    location.replace(location.href.split('#')[0]+'#/videos/detail/'+
      $(this).data("id‌"​)+'/'+
      $(this).data("target"​));
  });
});

Ответ 2

Чтобы заставить отобразить страницу, вы можете использовать:

$route.reload();

ср. Angular Документация:

Заставляет $route service перезагружать текущий маршрут, даже если $location не изменилось.

В результате этого ngView создает новую область действия, восстанавливает контроллер.

Ответ 3

Вы можете добавить метод в контроллер с требуемой функциональностью:

// view
<a ng-click="redirectWithReload('#/videos/detail/'+video.Id)">

// controller
$scope.redirectWithReload = function(url) {
   $location.url(url); // use $location service
}

Ответ 4

Можете ли вы попробовать любой из них в onclick:

  • history.go(0);
  • window.location.href= window.location.href;

Попробуйте:

window.location.href = "your_page.html" + "?" + Date.parse(new Date());

Этот метод позволяет не использовать какую-либо кешированную страницу, и я применяю ее всякий раз, когда страница должна быть перезагружена через JS