无法在引导程序中初始化弹出框答案

【问题标题】：Can't initialize popovers in bootstrap无法在引导程序中初始化弹出框
【发布时间】：2015-06-05 19:48:41
【问题描述】：

我正在开发其他人的 Angular 应用程序。我正在尝试添加一个弹出框。 html 位于 ng-include 模板中，并且有一个标签：

<p class="filetracker-label" data-toggle="popover" title="title is here!" data-content="popOver on bottom">Tracked Files</p>

我在 body 标记中初始化了弹出框（bootstrap.js 和 jquery 在 head 标记中 - 我已经移动了它们，但它没有改变任何东西）：

<script>
$(document).ready(function() {
    $('[data-toggle="popover"]').popover({
        placement: 'left',
        trigger : 'hover'
    });
    console.log('here');
});
</script>

我在引导之前加载 jquery - 我已经研究了所有其他关于此的帖子，但我看不出我做错了什么。当我悬停时，我看到了标题文本，但它不是引导样式 - 当然内容不存在。

【问题讨论】：

标签： jquery angularjs twitter-bootstrap

【解决方案1】：

如果你想做 Angular 和 Bootstrap，我建议使用 UI Bootstrap，它是用纯 AngularJS 编写的 Bootstrap 组件。

带有 UI Bootstrap 的弹出框的文档在这里：http://angular-ui.github.io/bootstrap/#/popover

【讨论】：

【解决方案2】：

这是一个可能的解决方案：https://jsfiddle.net/99x50s2s/53/

看起来弹出框隐藏在页面中，因为您已将其位置设置为“左侧”。设置“跟踪文件”文本的宽度并将其位置更改为底部，将出现弹出框。

$('[data-toggle="popover"]').popover({
        placement: 'bottom',
        trigger : 'hover'
});

HTML

<p class="filetracker-label" data-toggle="popover" title="title is here!" data-content="popOver on bottom">Tracked Files</p>

CSS

.filetracker-label{
width:100px;
}

【讨论】：

这是我已经一字不差的 - 我看到你的小提琴作品，当然。不幸的是，这对我的问题没有帮助——尽管这可能是因为我没有包含一些必要的信息。可悲的是，我不知道此时还有什么相关的......
尝试从左到下更改展示位置。如果仍然没有出现，则问题可能出在代码中的其他地方。
这没有做任何事情 - 我不希望它这样做，因为放置是引导样式的一个功能，它根本不起作用。我意识到问题可能出在其他地方，但这不是我的代码，我不知道要查找什么。 :( 不过感谢您的帮助。
嗨 Vinesh，我解决了我的问题 - 我赞成你的评论 - 感谢您的帮助 - 我很感激！

【解决方案3】：

好吧，我确实想到了。弹出框初始化需要在应用程序的该部分的角度控制器内。回想起来有点明显，因为 html 在 ajax 请求之后被注入，这是在文档就绪函数已经触发之后。角度新手...

【讨论】：