Question

为什么这样做很好：

控制器：

$scope.getHtml = $sce.trustAsHtml("<div>Test</div>");

查看：

<div uib-tooltip-html="getHtml">Test</div>

但以下情况根本不起作用？ ;-(

控制器：

$scope.getHtml = function (){
        var textOutput = "<div>Text</div>";
        return $sce.trustAsHtml(textOutput);        
    };

查看：

<div uib-tooltip-html="getHtml()">Test</div>

错误信息是：angular.min.js：6未捕获错误：[$ rootScope：infdig]

编辑1：谢谢，原来的问题解决了。但现在我有另一个问题。如果<div>在ngRepeat中并且我想给函数一个ngRepeat项作为参数怎么办？像<div uib-tooltip-html="getHtml({{item}})">Test</div>一样？

编辑2：这是我的问题的一个更具体的例子。我想要这样的东西起作用：

<tr ng-repeat="object in objectArray">
    <td uib-tooltip-html="getHtml(object.value1)">{{object.value1}}<td>
    <td uib-tooltip-html="getHtml(object.value2)">{{object.value2}}<td>
    <td uib-tooltip-html="getHtml(object.value3)">{{object.value3}}<td>
</tr>

与

$scope.getHtml = function (value) {
    var textOutput = doSomethingWithObjectDataAndCreateHtmlFromIt(value);
    return $sce.trustAsHtml(textOutput);        
}

但它不起作用。当我使用uib-tooltip代替uib-tooltip-html时，我可以看到工具提示中包含正确的html（未解析），但如果我将其更改为uib-tooltip-html则会再次出现错误。

Answer 1

在第一个案例中，$scope.getHtml最终成为字符串。

在第二情况下，$scope.getHtml最终成为函数，返回与第一种情况相同的字符串。

但是如果你在第二种情况下调用你的函数，它会起作用，因为它基本上是相同的代码：

$scope.getHtml = function () {
    var textOutput = "<div>Text</div>";
    return $sce.trustAsHtml(textOutput);        
} ()

如果你想在ng-repeat中传递html数据，只需这样做：

$scope.getHtml = function (html) {
    return $sce.trustAsHtml(html);        
}

并使用它：

<div uib-tooltip-html="getHtml()">Test</div>

将内容添加到uib-tooltip-html

1 个答案: