小编典典

AngularJS 标记链接不起作用

angularjs

我有一个从搜索返回的对象的索引。该模板具有ng-repeat,其中项目的URL是根据模型中的数据构造的,但在最终标记中,“ a”标记无效。ng-
href和href正确,单击链接但页面未加载时,URL栏会更改。点击后刷新浏览器确实会获得页面。因此,Angular中的某些内容正在更改URL栏,但不会触发加载???

无法在jsfiddle中进行复制,因为问题似乎出在$
resource.query()函数之后,将json加载到模板中,而我无法从jsfiddle中做到这一点。使用模拟查询加载静态数据,即使最终标记看起来相同,jsfiddle也可以工作。

AngularJS模板如下所示:

<div ng-controller="VideoSearchResultsCtrl" class="row-fluid">
  <div class="span12" >
    <div class="video_thumb" ng-repeat="video in videos">
      <p>
        <a ng-href="/guides/{{video._id}}" data-method="get">
          <img ng-src="{{video.poster.large_thumb.url}}">
        </a>
      </p>
    </div>
  </div>
</div>

结果看起来不错,并产生以下最终标记:

<div ng-controller="VideoSearchResultsCtrl" class="row-fluid ng-scope">
  <div class="span12">
    <!-- ngRepeat: video in videos --><div class="video_thumb ng-scope" ng-repeat="video in videos">
      <p>
        <a ng-href="/guides/5226408ea0eef2d029673a80" data-method="get" href="/guides/5226408ea0eef2d029673a80">
          <img ng-src="/uploads/video/poster/5226408ea0eef2d029673a80/large_thumb_2101146_det.jpg" src="/uploads/video/poster/5226408ea0eef2d029673a80/large_thumb_2101146_det.jpg">
        </a>
      </p>
    </div><!-- end ngRepeat: video in videos -->
  </div>
</div>

控制器代码为:

GuideControllers.controller('VideoSearchResultsCtrl', ['$scope', '$location', 'VideoSearch',
    function($scope, $location, VideoSearch) {
        $scope.videos = VideoSearch.query({ namespace: "api", resource: "videos", action: 'search', q: $location.search().q });
    }
]);

使用AngularJS 1.2-rc.3。我也尝试过使用ng-
click和常规的旧onclick来加载即使带有静态URL的页面,但这些单击永远不会触发代码。此页面上的BTW静态非角度链接可以正常工作,因此菜单栏和注销有效。

我在这里做错了什么,或者这是AngularJS中的错误?


阅读 223

收藏
2020-07-04

共1个答案

小编典典

从邮件列表中,我得到了一个答案:

您是否有机会将$ locationProvider配置为html5Mode?如果是,这将导致您的问题。您可以通过在标签中添加target =“ _ self”来强制其始终转到网址。试一试。

我已经配置为使用HTML5,因此将target="_self"标记添加到标签中可以解决此问题。仍在研究为什么这样做。

2020-07-04