Question

我想在我的angularjs网络应用程序中使用twitter bootstrap的tootltip。当我在我的代码中简单地使用它们并将jQuery初始化放在document.ready内的js文件之上时，它可以很好地工作。

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

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

但是当我通过ui-routing在视图中使用它们时。它在控制台中没有错误就停止工作了.. 我还使用更多的javascript组件，如crousel。我想知道如何在视图广告文档中初始化/调用它们。已经无法在视图中工作。

我应该在我的控制器中初始化它们。如果是，那么？

Answer 1

如果你想在Angular中使用Bootstrap UI，最好使用Angular Module ui.bootrap找到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，请在指令的link函数中使用$('[data-toggle="tooltip"]').tooltip()创建指令并初始化工具提示。

如何在angularjs中使用twitter bootstrap javascript组件

1 个答案: