Angular.js - 在img src標籤中過濾

我們使用Angular主要用於我們的搜索表單，這非常複雜。我們使用Solr作爲搜索框架，並通過AJAX/JSONP獲得我們的搜索結果，該功能完美無缺。Angular.js - 在img src標籤中過濾

在每個搜索結果中都應該有一個圖像，但可能會發生沒有圖像。當我的搜索結果中沒有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>

就像我說的，對相關信息的正確傳遞，「問題」我是螢火蟲發出GET請求與角src喜歡：

http://test.com/foldername/%7B%7Bdoc.image_url%20|%20searchResultImg%7D%7D

鏈接編輯，所以它不會工作。否則客戶就會嚇壞了）

有沒有人有這種行爲的經驗或知道更好的方法來設置src標籤的過濾器？

來源

2012-10-30 Hyque

你的第一個問題，你可以解決通過onerror attr How to use – Janko

嘗試用ng-src替換src以獲取更多信息，請參閱the documentation或this post。

<a href="{{doc.url}}"><img ng-src="{{doc.image_url | searchResultImg}}"/></a>

採用了棱角分明的標記像{{哈希}}在src屬性不起作用權利：瀏覽器將網址提取與文字文本 {{哈希}}，直到角替換表達式在{{hash}}中。 ngSrc指令解決了這個問題。

來源

2012-10-30 16:51:18 Gloopy

非常感謝！這有助於:) – Hyque

Angular.js - 在img src標籤中過濾

回答

相關問題