2016-11-11 4 views
2

Почему это работает просто отлично:добавить содержание UIB-подсказке-HTML

Контроллер:

$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 Uncaught Ошибка: [$ rootScope: infdig]


Редактировать 1: Спасибо, оригинальная проблема решена. Но теперь у меня есть другой вопрос по этому вопросу. Что делать, если <div> остроумие hin a 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 (unparsed) в нем, но если я изменю его на uib-tooltip-html, появится ошибка снова.

ответ

0

В случае $scope.getHtmlпервый заканчивает быть строка.

В случае $scope.getHtmlвторой заканчивает быть функцией, которая возвращает ту же строку, как в первом случае.

Однако, если вы называете функцию во втором случае, он будет работать, так как это по сути тот же код:

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

если вы хотите передать HTML-данные в нг-повтора, просто сделать это :

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

и использовать его:

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

Ах! Спасибо огромное! Провел весь день по этому вопросу: D –

+0

Теперь у меня есть еще один вопрос. Я отредактировал свой оригинальный пост для него. –

+0

Удалите синтаксис шаблонов и он должен работать нормально:

Test

Смежные вопросы