Перезагрузка страницы на 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 он делает следующее:

  1. нажмите на ссылку
  2. url get обновлен
  3. расположение.reload () get называется страница обновляется
  4. url и угловой вид, go возвращается на страницу, где нажата ссылка
  5. при нажатии " F5 " фактическая страница и url загружаются в

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

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

EDIT: В конце концов сделано, сделав сочетание углового и некоторого 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-click, потому что, если мне когда-нибудь понадобится добавить больше vars в url-адрес, теперь это очень легко сделать :)

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

4 ответов


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

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

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

<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"​));
  });
});

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

$route.reload();

cf. Угловое Документации :

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

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


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

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

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

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

  1. история.go (0);