2016-11-11 6 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不明なエラー:[$ rootScope:infdig]


編集1:元の問題を解決していただきありがとうございます。しかし、今私はこの問題について別の質問があります。もし<div>がウィットであれば関数の引数としてngRepeatの項目を指定したいのですか? Like <div uib-tooltip-html="getHtml({{item}})">Test</div>


編集2:これは私の問題のより具体的な例です。

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

<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> 

しかし、それは動作しません:私は仕事にこのような何かをしたいです。 uib-tooltip-htmlの代わりにuib-tooltipを使用すると、その中に正しいhtml(解析されていない)のツールチップが表示されますが、uib-tooltip-htmlに変更するともう一度エラーが表示されます。 $scope.getHtmlストリングことが終わる場合

答えて

0

$scope.getHtmlが最初の場合と同じ文字列を返す関数、であること終わる場合

あなたは後者の場合には、あなたの関数を呼び出す場合は、それが働くだろう、それは本質的に同じコードであるとして:

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

あなたはNGリピートにHTMLデータを渡したい場合は、単にこれを行うには:

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

とでそれを使用する:

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

ああ!どうもありがとうございます!これで一日中過ごしました:D –

+0

今私はもう一度これに関する質問があります。元の投稿を編集しました。 –

+0

テンプレート構文を削除してもうまくいくはずです:

Test

関連する問題