我有一个从搜索返回的对象的索引。该模板具有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中的错误?
从邮件列表中,我得到了一个答案:
您是否有机会将$ locationProvider配置为html5Mode?如果是,这将导致您的问题。您可以通过在标签中添加target =“ _ self”来强制其始终转到网址。试一试。
我已经配置为使用HTML5,因此将target="_self"标记添加到标签中可以解决此问题。仍在研究为什么这样做。
target="_self"