首页 > Angular.js和jquery的兼容问题

Angular.js和jquery的兼容问题

我的一个项目使用了Angular作为主要框架,页面用UI-router按需加载,整体的请求相应布局都OK,但是在页面实现细节上出了问题: 第一个,本来是模仿淘宝上浏览图片的方式,4张小图上面有一张大图,点哪张小图,大图就是哪张; 第二个,是加入购物车的动画,这两个都是用了jquery,本来可以正常实现,加入了angular的东西以后就不能用了,这2个的js文件是在router.js文件和controller.js文件后面加载的,代码如下 `

$(function() {
    var offset = $("#end").offset();
    $(".addcar").click(function(event){
        var addcar = $(this);
    var img = addcar.parent().find('img').attr('src');
    var flyer = $('<img class="u-flyer" src="'+img+'" >');
    flyer.fly({
      start: {
        left: event.pageX,
        top: event.pageY
      },
      end: {
        left: offset.left+10,
        top: offset.top+10,
        width: 0,
        height: 0
      },
    });
  });
});
$(document).ready(function(){
    $(".jqzoom").imagezoom();
    $("#thumblist a").click(function(){
        $(this).addClass("tb-selected").siblings().removeClass("tb-selected");
        $(".jqzoom").attr('src',$(this).find("img").attr("mid"));
        $(".jqzoom").attr('rel',$(this).find("img").attr("big"));
    });
});

`主要是想弄明白,angular和jquery的兼容冲突问题是怎样的?是否有方法避免这种冲突问题?上述代码中是否有地方写的不合理,导致在使用了angular以后就无法正常工作?求助各位帮忙看下


建议你把angular的controller范围缩小,这样jq和angular的交集就可以避免了。你说的动态效果用angular一样可以实现,没必要和jq混用。


Jquery在angular之前引用,angular内部的jqlite就跟jquery一样了

【热门文章】
【热门文章】