在MEAN.JS堆栈中运行jQuery代码

我开始与NodeJS合作,并且更加专注于MEAN.JS. 我试图运行一些自定义JS代码,使用JQuery,但无论我把代码放在哪里,nevers运行如预期。 这是我的脚本:

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

我试图把它放在页面的主体中,在一个单独的脚本中,但没有。 当我在Chrome中debugging时,variablestooltips不包含任何元素,但如果我在Chrome的控制台中执行相同的代码,那么它工作。 在我看来,尽pipe$(document).ready()东西,DOM代码执行时还没有准备好。 也许AngularJS正在同时发挥作用,并干扰。

有什么我需要这样做,代码将被执行? 我需要在/之前加载它吗?

谢谢你的帮助。

  • 错误的请求 - 节点js ajax后
  • JavaScript和Node.js REST风格的Web应用程序
  • 无法安装Bower - 语法错误
  • 让div溢出-y从底部开始滚动
  • 在大文件的http传输中间歇性地获取TCP._onclose
  • JQuery的UIsorting索引更改重新sorting列表
  • 在nodejs上添加jquery Serverside:特别使用$ .getJSON在nodeJS上不起作用
  • JS / JQUERY不更新string数组值
  • 我会build议创build一个指令,而不是在一个dom准备好应用它:

     angular.module("myModule") .directive('tooltip', function () { return { restrict: 'A', link: function (scope, elem) { $(elem).tooltip(); } } }); 

    现在,无论何时您在其中一个模板的某个元素上使用tooltipdata-tooltip属性,工具提示插件都将应用于该模板。

    免责声明:我还没有testing过这个代码,最后会build议不要使用jquery这个。 相反,使用angular-bootstrap-tooltip或类似的angular度解决scheme

    工具提示将不包含任何元素,因为它仅限于您为$(document).ready()指定的匿名函数的范围。 其次,“提示”在variables声明中拼写错误。 试试这个代码来帮助你debugging:

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

    现在你可以进入控制台并评估variables$tooltips ,看它是否在那里。 注意:我在$前面加了一个variables,以帮助将其识别为一个jQuery对象。 不要将其与内置的Angular服务混淆。

    另外,Angular不会在它生成页面的模板中执行JavaScript。 请务必在主页面输出中指定外部JavaScript,或者在Angular载入视图时将此代码放在执行位置。