Question

我正在创建一个AngularJS单页应用程序。数据将以json - 格式的网络服务提取。

问题是某些文本元素带有预先格式化的html标记

json输出：

{
   "text": "<p><span style="text-decoration: underline;"><strong>test text</string></span></p>"
}

现在如何显示此文本并直接呈现html，以便只向用户显示“test”，其余用作标记？

<h1>{{data.text}}</h1>

Answer 1

您需要将100px添加到h1标记。

你的HTML看起来像：

文档：ngBindHtml

Answer 2

Update2：是否可以为您删除HTML？可以这样做：

angular.module('myApp.filters', []).
   filter('htmlToPlaintext', function() {
      return function(text) {
         return String(text).replace(/<[^>]+>/gm, '');
      };
   }
);

你的HTML：

<div>{{myText | htmlToPlaintext}}</div>

查看更多信息：angularjs to output plain text instead of html

更新：你真的需要你的json的html吗？最好将html存储在视图中并从json获取数据。分离效果好，使用方便。

这可能，但不是非HTML（非常安全）。

在Angular 1.3中，您需要如下：

<div ng-bind-html="htmlBind"></div>

在你的控制器中添加：

$scope.htmlBind = $sce.trustAsHtml('<span>Hi, I am <em>Joe</em>');

说明：你看到$ sce：

$ sce是一种为AngularJS提供严格上下文转义服务的服务。

trustAs（类型，值）

代表$ sceDelegate.trustAs。因此，返回一个受angular信任的对象，以便在指定的严格上下文转义上下文中使用（例如ng-bind-html，ng-include，任何src属性插值，任何dom事件绑定属性插值，例如forclick等。）使用提供的值。请参阅* $ sce以启用严格的上下文转义。

在这里阅读更多内容：

Answer 3

尝试使用此https://docs.angularjs.org/api/ng/directive/ngBind

int[] SubState = State [0];

如何使用AngularJS渲染原始html？

3 个答案: