如何使用圖像`alt`標籤的字符串不編碼由AngularJs

<div class="myStyle"> 
    TITLE: 
    {{product.title}} 
</div>

我想表明title沒有編碼。所以我知道這是一個解決方案：

<div class="myStyle"> 
    TITLE: 
    <span ng-bind-html="product.title"></span> 
</div>

但我不喜歡額外的<span>代碼！

另外，如果我有這樣的代碼：

<img src="img.jpg" alt="{{product.title}}">

我不能使用額外的span，現在我怎麼能顯示圖像的alt標籤title沒有編碼？

我假設，因爲你使用ng-bind-html這product.title是HTML字符串，而不是文本

您可以創建一個自定義過濾器，從HTML字符串返回文本

app.filter('htmlToText', function(){ 
    return function(html){   
    return angular.element('<div>').append(html || '').text(); 
    }; 
});

查看

<img src="img.jpg" alt="{{product.title | htmlToText}}">

2016-02-28 00:41:54 charlietfl

對於顯示DIV product.title，如果你不喜歡多餘的跨度，你可以嘗試：

<div class="myStyle" ng-bind="product.title"></div>

凡在你的JavaScript代碼，你可以添加一個前綴：「標題：」到product.title。（雖然我不覺得有一個額外的跨度是壞的）

另一個方面說明，我看你正在使用NG綁定，HTML。「product.title」真的是html嗎？如果它包含一些樣式，也許你可以修改你的「myStyle」來控制樣式。讓數據成爲數據。

對於圖像之一，你也許並不需要擔心{{}}。

我猜你不喜歡它的原因{{}}是他們可能會暫時表現出前角可以使與數據的模板。但是，如果你把他們在，瀏覽器將不顯示內容ALT裏面，除非你的圖像不可用（如果圖像是真的不適用，您可以考慮重新審視你的代碼，以確保它是可用的，或顯示默認圖片）

2016-02-28 02:00:02 Peter

回答