Jhipster网关项目使ng-bind-html工作

我正在做一个微服务网关。我的一个实体有一个字段（其名称是productImgHyperLink），它是一个字符串字段，并具有完整的html元素，如下所示将存储为其内容。Jhipster网关项目使ng-bind-html工作

<img src="http://image.xyz.com/images/I/431156.789.jpg" border="0" alt="Product Image">

在生成的html的，它可以显示内容

<td>{{productInfo.productImgHyperLink}}</td>

不过，我想它显示为图像，比文本串等。

我已经试过

添加 'ngSanitize'，在web应用程序\ app.module.js

下添加weapp一个trustAshtml.js \程序\元件库] UTIL \ 的trustAshtml.js contnet如下所示。

/** 
* 
*/ 
(function() { 
    'use strict'; 

    angular 
     .module('kdiStoreApp') 
     .filter('trustAsHtml', trustAsHtml); 

    function trustAsHtml($sce) { 
     return function(html) { 
      return $sce.trustAsHtml(html); 
     } 
    } 
})();

然后将详细信息页中字段的html更改为下方。

<td ng-bind-html={{productInfo.productImgHyperLink | trustAsHtml}}></td>

但是，它不能显示在输出的图像。

上最终的HTML输出是象下面这样的内容：

<td ng-bind-html="<img src="http://image.xyz.com/images/I/431156.789.jpg" border="0" alt="Product Image">"></td>

输出，它是相同的用低于没有 “| trustAsHtml”

<td ng-bind-html={{productInfo.productImgHyperLink}}></td>

请问任何人有关于如何使图像显示的建议？谢谢。

来源

2016-09-18 Maosheng Wang

正确的语法是'{{productInfo.productImgHyperLink | trustAsHtml}}' –

谢谢，那是一个错误的类型。在{{productInfo.productImgHyperLink | trustAsHtml}}，它也不会显示出来。 –

如果你想要显示图像，你应该使用<img ng-src={{your-link-property}}></img>。对不起，没有看到你正在保存一个完整的HTML标签。

来源

2016-09-29 05:44:57 atomfrede

Jhipster网关项目使ng-bind-html工作

回答

相关问题