在angularjs模板中的jQuery目标元素,不会触发

前端之家收集整理的这篇文章主要介绍了在angularjs模板中的jQuery目标元素,不会触发前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个角度应用程序,它在索引中加载,不同的模板与ng-view.在索引中,我加载了所有脚本文件(angular和 jquery),包括main.js文件,其中包含我编写的jQuery代码.如果我使用jQuery从索引文件中定位元素,一切正常,但如果我将模板中的元素作为目标,则jQuery不起作用.

如果我使用firebug调试jQuery并在click函数的开头放置一些断点,并且在函数内部,代码可以工作.

如果我将标签放在模板中,使用jQuery代码,代码就可以了.

这是我尝试运行的jquery代码

$('.text-down-arrow').click(function () {
    $('.text-up-arrow').removeClass('hidden');
});

我尝试将main.js文件中的所有内容包装为:

(function ($) {
        $(document).ready(function () {...});
    })(jQuery);

或没有$(document).ready(function(){});

任何人都知道是什么导致这个或我是否应该在每个模板中加载jquery?

解决方法

Jquery不会这样做.因为在文件准备好的时候.带箭头的HTML还没有. angular在某个点设置视图

所以你想用ng-click触发角度方式的点击

>将点击附加到html元素

< div ng-class =“{hidden:isHidden}”ng-click =“{toggleHidden()}”>

>创建一个函数,用于切换要在ng-class中使用的var

$scope.toggleHidden = function(){ $scope.isHidden =!$scope.isHidden;}

猜你在找的Angularjs相关文章