2016-06-09 73 views
0

所以我的问题是,当我尝试呈现AngularJS绑定jQuery中的onclick功能,它不会使数据绑定onclick="startTimer({{ $index }},{{ product.time }})"如何在jQuery onClick函数中呈现AngularJS数据绑定?

但是当我使用这个ng-click="startTimer({{ $index }},{{ product.time }})"已经呈现,但问题是,NG-点击obyously没有按”牛逼启动该功能在我的jQuery脚本

<script> 
function startTimer(id, time) { 
    $("#" + id).next("div").removeClass("claimActive"); 
    $("#" + id).next("div").addClass("claimWait"); 
    $("#" + id).removeClass("timerActive"); 
    $("#" + id).addClass("timerWait"); 
    $("#" + id).next("div").children("a").text("WAIT"); 
    if (time <= 60) { 
     if (time < 10) $("#" + id).children("#m").text("0" + time); 
     else $("#" + id).children("#m").text(time); 
     $("#" + id).children("#s").text("30"); 
    } else { 
     if (time < 600) $("#" + id).children("#h").text("0" + time/60); 
     else $("#" + id).children("#h").text(time/60); 
     $("#" + id).children("#m").text("00"); 
     $("#" + id).children("#s").text("30"); 
    } 
} 

function checkTimers() { 
$(".timer").each(function() { 
    seconds = parseInt($(this).children("#h").text()) * 3600 + parseInt($(this).children("#m").text()) * 60 + parseInt($(this).children("#s").text()); 
    if (seconds > 0) { 
     hours = parseInt($(this).children("#h").text()); 
     min = parseInt($(this).children("#m").text()); 
     sec = parseInt($(this).children("#s").text()); 
     if (sec > 0) { 
      if (sec > 10) $(this).children("#s").text(sec - 1); 
      else $(this).children("#s").text("0" + (sec - 1)); 
     } else if (min > 0) { 
      if (min > 10) $(this).children("#m").text(min - 1); 
      else $(this).children("#m").text("0" + (min - 1)); 
      $(this).children("#s").text(59); 
     } else if (hours > 0) { 
      if (hours > 10) $(this).children("#h").text(hours - 1); 
      else $(this).children("#h").text("0" + (hours - 1)); 
      $(this).children("#m").text(59); 
      $(this).children("#s").text(59); 
     } 
    } else { 
     $(this).next("div").removeClass("claimWait"); 
     $(this).next("div").addClass("claimActive"); 
     $(this).addClass("timerActive"); 
     $(this).removeClass("timerWait"); 
     $(this).next("div").children("a").text("CLAIM"); 
    } 
}); 
} 
$(document).ready(function() { 
setInterval(checkTimers, 1000); 
}); 
</script> 

所以我只是魔杖找到来呈现的onclick数据绑定和不用于渲染结合使用NG点击的方法。

然而,你可以在这里检查项目https://plnkr.co/edit/m1R1PesR0HoblSaN6M1T?p=preview,你可以看到如何改变的onclick到NG-单击此渲染,但不启动jQuery的功能,也可以看到如何改变onclick="startTimer({{ $index }},{{ product.time }})"onclick="startTimer(0,5)"完美的作品,但我需要使用来自AngularJS的数据交换。

任何想法如何我可以呈现在onclick数据绑定?

+2

这根本就不是办法与角度一起工作。强烈建议阅读[思考角度当我有一个jQuery背景](http://stackoverflow.com/questions/14994391/thinking-in-angularjs-if-i-have-a-jquery-background) – charlietfl

+1

我想找这样的解决方案'Go'这个'Go' – Johan

+0

但我不知道如何在我的代码中应用这样的东西。 – Johan

回答

0

如果你运行该代码这样才下面应该工作(否则找角度具体实施)

此加入的onClick功能:

var scope= $(".claimButton").scope(); 
scope.$apply(); 
+0

你能帮我申请闯入者吗?因为不适合我 – Johan