AngularJS中页面呈现html代码段

Posted 2020-06-13

 

如何在页面呈现一段html代码段呢？

在textarea中我们这样写：

<textarea name="" id="" cols="30" rows="" ng-model="app.someHtml"></textarea>

也可以这样写：

<div ng-bind-html="app.someHtml"></div>

在controller中大致这样写：

var app = angular.module(‘app‘,[]);

app.controller("AppCtrl", function(){
    var app = thisj;
    app.someHtml = ‘<a href="#">Hello</a>‘;
})

但，这样会报错。

如何避免呢？

--需要安装angular-sanitize

npm install angular-sanitize

controller中改成这样：

var app = angular.module(‘app‘,["ngSanitize"]);

app.controller("AppCtrl", function($sce){
    app.someHtml = $sce.trustAsHtml(‘<a href="#" style="color:red">Hello</a>‘);
})

$sce用来信任html代码段。好让类似style这种属性生效、被信任。