Javascript jQuery单击事件不适用于AngularJS_Javascript_Jquery_Angularjs

Javascript jQuery单击事件不适用于AngularJS

javascript jquery angularjs

Javascript jQuery单击事件不适用于AngularJS,javascript,jquery,angularjs,Javascript,Jquery,Angularjs,我正在将我的多页面php+jquery网站转换为一个单页面应用程序。然而，我已经用jquery编写了很多代码，所以我只打算在路由等方面用php替换angular 我遇到的一个无法解决的问题是，在转换停止工作之前，我一直在使用jquery click事件。如果更改代码以使其从ng单击触发，那么它将工作，如果我从控制台调用该函数，也是如此。jquery正在工作，我在提到的函数中加入了一些jquery，它工作得很好 <!doctype html> <html ng-app="myAp

我正在将我的多页面php+jquery网站转换为一个单页面应用程序。然而，我已经用jquery编写了很多代码，所以我只打算在路由等方面用php替换angular

我遇到的一个无法解决的问题是，在转换停止工作之前，我一直在使用jquery click事件。如果更改代码以使其从ng单击触发，那么它将工作，如果我从控制台调用该函数，也是如此。jquery正在工作，我在提到的函数中加入了一些jquery，它工作得很好

<!doctype html>
<html ng-app="myApp">
<head>
  <link href="css/header.css" rel="stylesheet">
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.11/angular.js"></script>
  <script src="https://cdn.firebase.com/js/client/2.2.4/firebase.js"></script>
  <script src="https://cdn.firebase.com/libs/angularfire/0.9.2/angularfire.min.js"></script>
  <script type='text/javascript' src="js/jquery.min.js"></script>
  <script type='text/javascript' src='js/header.js'></script>
  <script type='text/javascript' src='main.js'></script>
</head>
<header-page></header-page>

header.js

(function() {
    var app = angular.module('headerPage', ['firebase']);

    app.controller("headController", ['$http', '$firebase', '$scope', '$filter',
        function($http, $firebase, $scope, $filter) {
            //most of the code
        }
    ]);
})();

$("#myElement").on("click", function() {
    console.log("clicked");
});

尝试使用ng click

我知道这并不能真正解决jQuery的问题，但它有助于将所有代码保存在一个框架下。

或者：如果您想坚持使用

jQuery

，您可以使用：

例如：

HTML

编辑：添加了fiddle fwiw:

原因是，当您将事件绑定到元素

#myElement

时，该元素还不存在。由于该元素是作为指令模板的一部分呈现的，因此需要在指令链接函数中移动绑定处理程序。从技术上讲，您可以使用事件委派来解决这个问题，但这只是一个又一个黑客攻击。最好的办法是在元素上使用

ng单击本身（您已经说过您已经尝试过了）。
我主要想删除php，以便让它在phonegap上工作。我有上千行代码和功能完美的jquery（…我确实这么做了），因此我需要很长时间才能更改它，而没有真正的收益。jquery的事件委派可能会起作用，作为一种可能的解决方案发布在下面。试一试。@Shehryar:对不起，那没用。@Marty.H..hmm，为了黑客的缘故，我在angularjs控制器中试用了jquery事件委派方法：…点击事件正在控制台中注册。酷，它工作正常，但为什么不工作（$（'.child'）。on（'click'，function（）{console.log（“click”）；}）;
(function() {
    var app = angular.module('headerPage', ['firebase']);

    app.controller("headController", ['$http', '$firebase', '$scope', '$filter',
        function($http, $firebase, $scope, $filter) {
            //most of the code
        }
    ]);
})();

$("#myElement").on("click", function() {
    console.log("clicked");
});

<div id="myElement" ng-click="myFunction()"></div>

myApp.controller('MyController', ['$scope', function($scope) {
  $scope.myFunction = function() {
    //Content here
  }
}]);

<div id="parent">
  <a href="#" class="child">Click Here</a>
</div>

$('#parent').on('click', '.child', function() {
  console.log("click");
});