UI-ブートストラップツールチップ

Question

私は、次のしているコード

//テンプレート

<span> 
    hello world! 
</span> 

//指令

'use strict'; 

var referenceFieldTemplate = require('./reference-field.html'); 

module.exports = directiveFunction; 

/* @ngInject */ 
function directiveFunction($http) { 
    return { 
    restrict: 'E', 
    scope: { 
     fieldName: '=', 
     fieldValue: '=' 
    }, 
    templateUrl: referenceFieldTemplate, 
    controller: function($scope){ 
     console.log($scope); 
    }, 
    link: function(scope, element, attr) { 
     element.bind('mouseover',function(e) { 
     console.log(e); 
     }); 
    } 
    } 
} 

私はカスタムディレクティブをレンダリングしようとしています次のコードを使用するuib-tooltip

function eventRender(event, element, view) { 
    var hoverMarkup = '\'<reference-field field-name="test" field-value="test"></reference-field>\'' 
    element.attr({ 
     'uib-tooltip-html': hoverMarkup, 
     'tooltip-append-to-body': true, 
     'tooltip-class': 'tooltip-wrapper' 
    }); 
    $compile(element)($scope); 
}; 

コンパイル後、DOMにディレクティブがありません。私はそれがレンダリングされていない理由を理解したい。コンソールにエラーはありません。

ありがとうございます。

Answer 1

私は最近、 "uib-tooltip-template"を使って同様のことをしました。すべてのHTMLコードをテンプレートの中に入れてください。

あなたの指示が内部にあるhtmlファイルを作成し、$ scopeを介してツールチップに渡してください。