Question

我有一个数组（在Angular中），看起来像这样

$scope.posts = [
    {
        "ID" : id(),
        "Title" : "A",
        "Company" : "Company A",
        "Location" : "San Francisco, CA",
        "Date" : "2016-06-20",
        "Description": "Description<br>Desciption part 2",
     }
];

使用<p>{{post.description}}</p>的div中的ng-repeat = "post in posts"调用说明。

然而，结果是它显示如下

Description.<br>Description part 2

而不是

描述
描述第2部分。

插入<ul>和<li>标记同样如此。

有没有什么方法可以让数组值中的html结构实际显示为html而不是像这样明确显示？

Answer 1

您应该使用类似ng-bind-html="post.Description"的内容将其显示为HTML。

或者您可以使用ngSanitize来清理HTML

像这里的事情 - https://jsfiddle.net/datachand/szc550yb/4/

在控制器中，如果需要，请尝试使用$sce.trustAsHtml(post.Description)

Answer 2

使用angular的ngBindHtml指令正确显示html：

https://docs.angularjs.org/api/ng/directive/ngBindHtml

另外，请注意您需要将ngSanitize添加到模块中。

Answer 3

<p>{{post.Description}}</p>

资本描述

AngularJS数组值包含HTML标记，在调用时无法正确显示

3 个答案: