Question

假设验证成功，我如何调用此Jquery事件...

<script>
    $('#login').click(function() {
      //blah blah blah...
    });
</script>

从这个AngularJS函数

<script>
// create angular app
    var validationApp = angular.module('validationApp', []);

    // create angular controller
    validationApp.controller('mainController', function($scope) {

        // function to submit the form after all validation has occurred            
        $scope.submitForm = function() {

            // check to make sure the form is completely valid
            if ($scope.userForm.$valid) {
                // Call my Jquery function here
            }

        };

    });
</script>

Answer 1

jQuery和AngularJS可以协同工作，但这不是一个好习惯。您可以使用内置的AngularJS ng-click来触发onClick事件并将函数应用于它，如下所示：

<div id="login" ng-click="loginScriptToRunOnClick()"> My Login Div </div>

Answer 2

正如其他答案所建议的那样，当AngularJS和jQuery可以协同工作时，你所尝试的并不是一个好习惯。最好的方法是在控制器中定义一个单独的函数，然后从验证中调用它。

    <script>
    // create angular app
    var validationApp = angular.module('validationApp', []);

    // create angular controller
    validationApp.controller('mainController', function($scope) {
        var vm = this;
        vm.loginClick = function () {
              //blah blah blah...
        }
        // function to submit the form after all validation has occurred            
        $scope.submitForm = function() {

            // check to make sure the form is completely valid
            if ($scope.userForm.$valid) {
                vm.loginClick();
            }

        };

    });
</script>

如果你真的必须调用jquery函数（例如，因为它来自你无法控制的另一个组件），那么按照此链接how can i trigger the click event of another element in ng-click using angularjs?

的建议，有一种优雅的方式来执行此操作

如何在AngularJS函数中调用JQuery事件

2 个答案: