Question

我遇到了这个问题，我无法弄清楚发生了什么：我正在使用Angular及其路由机制。

所以我有一个网址：

<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上，它正在做以下事情：

点击链接
网址获取更新
调用location.reload（）获取正在刷新的页面
网址和角度视图，返回到点击链接的页面
按“F5”时，实际页面和网址正在

我也尝试过location.reload(true);，因为路径可能是缓存的，但是没有运气。

如果您想知道为什么刷新和位置：我需要刷新页面以便重新加载插件（由于其中存在错误），这个方法是我能想到的第一个。

修改最后通过组合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以防止默认并且进行了一次点击，因为如果我需要向网址添加更多变量，现在很容易做到：）

感谢您的帮助！特别是：@mplungjan

Answer 1

如果您将ID存储在属性中并使用替换，则可以执行

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

Answer 2

要强制渲染页面，您可以使用：

$route.reload();

比照Angular Documentation：

导致$ route服务重新加载当前路线，即使$ location没有改变。

因此，ngView创建新范围，重新实现控制器。

Answer 3

您可以在控制器中添加所需功能的方法：

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

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

Answer 4

你可以在onclick中试试其中任何一个：

history.go（0）;
window.location.href = window.location.href;

请尝试：

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

此方法确保不使用任何缓存页面，每当需要通过JS重新加载页面时我都应用此方法

在FF上重新加载页面而不更改页面

4 个答案: