Question

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

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

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

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

但是，我希望将其显示为图像，而不是文本字符串。

我试过了

将“ngSanitize＆＃39;”添加到webapp \ app.module.js

在weapp \ app \ compoments] util \下添加trustAshtml.js 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>

输出，与没有＆＃34;下面的使用相同| trustAsHtml＆＃34;
```
<td ng-bind-html={{productInfo.productImgHyperLink}}></td>
```

请有人对如何显示图像有任何建议吗？感谢。

Answer 1

如果您想要显示图像，则应使用<img ng-src={{your-link-property}}></img>。抱歉，您没有看到保存完整的html标记。

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

1 个答案: