我们使用Angular主要用于我们的搜索表单,这是非常复杂的。我们使用Solr作为搜索框架,并通过AJAX / JSONP获得我们的搜索结果,这是完美的。
每个搜索结果中都应该有一个图像,但是没有一个可以发生。
当我的搜索结果中没有img-URL时,我使用过滤器来防止Internet Explorer中的“X”异常。
angular.module('solr.filter',[]). filter('searchResultImg',function() { return function(input) { if (typeof(input) == "undefined") { return "http://test.com/logo.png"; } else { return input; } }; });
<a href="{{doc.url}}"><img src="{{doc.image_url | searchResultImg}}"/></a>
像我说的那样,信息传递正确,“我遇到的问题是,Firebug发送一个GET请求与Angular src像:
http://test.com/foldername/%7B%7Bdoc.image_url%20|%20searchResultImg%7D%7D
链接被编辑,所以它不会工作。其他客户吓坏了)
有没有人有这种行为的经验或知道更好的方式来设置src标签的过滤器?
尝试用ng-src替换src以获取更多信息,请参见
the documentation或
this post。
<a href="{{doc.url}}"><img ng-src="{{doc.image_url | searchResultImg}}"/></a>
Using Angular markup like {{hash}} in a src attribute doesn’t work right: The browser will fetch from the URL with the literal text {{hash}} until Angular replaces the expression inside {{hash}}. The ngSrc directive solves this problem.