对URL使用ng-bind-html

Question

目前，我有一个带有ng-bind-html的div，用于绑定到传入的HTML

<div ng-bind-html="renderHtml(message.text)" />

目前message.text是超文本标记语言。我更愿意传入一个URL并将其插入到div中。

我怎样才能做到这一点呢？

Answer 1

就我个人而言，我会制定一个自定义指令来做这样的事情。

我会将url作为属性参数发送，让指令使用$http.get()获取html，并在加载时将其附加到html中。

Answer 2

您可以将源添加为：

<div ng-bind-html="URl | safeHtml"></div>

并且需要添加$sce，以便使用以下指令安全绑定url：

app.filter('safeHtml', function ($sce) {
    return function (val) {
        return $sce.trustAsHtml(val);
    };
});

编辑：

与其直接绑定url，不如将其嵌入到iframe中，并使用它进行安全绑定：

$scope.URL = <iframe ng-src="url"></iframe>

Answer 3

我会这样做：

<input ng-model="myUrl"/>
<div id="myDiv" />

然后为myUrl添加一个监视，并在每次url更改时请求该url：

$scope.$watch('message.text', function(newValue) {
    $.ajax({ url: 'newValue', success: function(data) { 
        $("#myDiv").html(data);
    }});
}