2017-11-18 11 views
1

私はangularjsウェブアプリケーションでtwitterのブートストラップのtootltipを使いたいと思います。私のコードで単純に使用し、jQueryの初期化をdocument.ready内のjsファイルの上に置くと、完全に動作します。anglejsのtwitter bootstrap javascriptコンポーネントの使い方

$(document).ready(function(){ 
    $(function() { 
     $('[data-toggle="tooltip"]').tooltip() 
    }); 
    $('.myslider').myslider(); 
}); 

var myapp = angular.module("eplApp",['ui.router']); 

ただし、私はそれらをui-routingで表示します。それはコンソールでエラーなしで動作を停止します。 私はまた、crouselのようなより多くのjavascriptコンポーネントを使用しています。私はどのように初期化するかを知りたいと思いますview ad document.readyでそれらを呼び出すビューでは動作しません。

コントローラで初期化する必要があります。 はいの場合は?あなたが角度にブートストラップUIを使用する場合、角度モジュールui.bootrapを使用するには良いアイデアだろう

+0

[Angularjs:Directive with Bootstrap Tooltip](https://stackoverflow.com/questions/37711703/angularjs-directive-with-bootstrap-tooltip)の可能な複製 –

答えて

0

は、常にブートストラップツールチップのための独自の角度ディレクティブを作成できますが、これはアウト迅速な方法ですhere

を見つけました。

var myapp = angular.module("eplApp",['ui.router','ui.bootstrap']); 

とあなたのHTML内

<button tooltip-placement="{{placement.selected}}" uib-tooltip="On the {{placement.selected}}" type="button" class="btn btn-default">Tooltip text</button> 

ui.routerを使用してルートが再び$document.ready()発生しません変更。 $doucment.ready()が呼び出された後に状態がロードされると、コードは機能しません。 ui.bootstrapを含めたくない場合は、ディレクティブのリンク機能に$('[data-toggle="tooltip"]').tooltip()を使用してディレクティブを作成し、ツールチップを初期化してください。