如何从页面中的jquery调用angular js函数控制器 [英] How to call angular js function controller from jquery in page

问题描述

如何从jquery
调用angularjs函数或控制器我是这个angularjs
的新手这里是我的函数在这里我必须从jquery传递var1和var2我搜索了很多文章但是我不能理解。请帮帮我

How to call angularjs function or controller from jquery I am new to this angularjs here is my function here i have to pass the var1 and var2 from jquery i have searched many articles but i cant understand. Please help me

<script type="text/javascript">

    function customersController($scope, $http) {
        $http.get("https://tic.com/testingservice/HttpService.svc/operator/var1/var2")
        .success(function (response) { $scope.names = response; });
    }

推荐答案

如果我说一般，可能会出现Angularjs app中需要使用jQuery的情况，即使用Angular版本中没有的jQuery插件。

If I speak general, there can be cases when jQuery use is need in Angularjs app i.e. jQuery plugin is used that isn't available in Angular version.

每个控制器都有$ scope / this，如果你有一个ID标签附加到与ng-controller相同的DOM元素，你可以访问角元素的范围：

Every Controller has $scope/this and You can access the scope of an angular element if you have an ID tag attached to the same DOM element as the ng-controller:

DOM：

<div id="myctrl" ng-controller="MyCtrl"></div>

您的控制人：

function MyCtrl($scope) {
   $scope.anyFunc = function(var1, var2) {
      // var1, var2 passed from jquery call will be available here
      //do some stuff here
   }
}

在jQuery中你这样做它将访问该控制器并调用该函数：

in jQuery you do this and it will access that controller and call that function :

angular.element('#myctrl').scope().anyFunc('value1','value2');

正在运行的样本

angular.module('app', [])
    .controller('MyCtrl', function ($scope) {
    $scope.anyFunc = function (var1, var2) {
        alert("I am var1 = " + var1);
        alert("I am var2 = " + var2);
    };
});

$(function(){

    $("#hit").on("click",function(){
       
          angular.element($("#myctrl")).scope().anyFunc('VAR1 VALUE', 'VAR2 VALUE');
    
    });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div id="myctrl" ng-app='app' ng-controller="MyCtrl">
Call via jQuery
<button id="hit">Call</button>
</div>

快乐帮助！

这篇关于如何从页面中的jquery调用angular js函数控制器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！