Передача значения из события JQuery в AngularJS

Question

У меня есть веб-приложение ASP.NET MVC. Я заменяю только существующий элемент управления таблицей (JQuery html code) с сеткой AngularJS. Я хочу передать значение id в приложение AngularJs из jQuery click event. На событие клика ниже код не работает. Пожалуйста, предложите правильный способ передать значение. Использование углового элемента не работает.

$(".bs-example").on('click', '#alldiv a', function() { 
      var id = $(this).attr("id"); 
      // This id is required to use in angular app 
      angular.element($("#my-table")).scope().getData(); 
}); 


var myApp = angular.module('myGrid', ['ngTable']); 
      myApp.controller('gridCtrl', ['$scope', '$http', 'services', 'NgTableParams', function (scope, http, ser, NgTableParams) { 
       ser.getData().success(function (response) { 
        scope.agendas = response; 
        scope.tableParams = new NgTableParams({ page: 1, count: 2 }, { dataset: scope.mydata }); 
       }); 
       scope.mydata = { 
        data: 'mydata' 
       } 
      }]); 
      myApp.service('services', function ($http) { 

       this.getData = function() { 
        // Need id from button jQuery click event 
        var result = $http.get('/Home/GetData/' + id); 
        return result; 
       }; 
      }); 



<div data-ng-app="myGrid" data-ng-controller="gridCtrl" id="my-table"> 
//..... 
</div 

Answer 1

Это должно сработать. EDIT:

$(".bs-example").on('click', '#alldiv a', function() { 
        var id = $(this).attr("id"); 
        //HEre you pass a id to angular controller. 
        angular.element($("#my-table")).scope().getData(id); 
     }); 





     var myApp = angular.module('myGrid', ['ngTable']); 
        myApp.controller('gridCtrl', ['$scope', '$http', 'services', 'NgTableParams', function (scope, http, ser, NgTableParams) { 
         $scope.GetData = function(id) { 
         ser.getData(id).success(function (response) { 
          scope.agendas = response; 
          scope.tableParams = new NgTableParams({ page: 1, count: 2 }, { dataset: scope.mydata }); 
         }); 
} 
         scope.mydata = { 
          data: 'mydata' 
         } 
        }]); 
        myApp.service('services', function ($http) { 

    //Add to this function parameter 
         this.getData = function (id) { //here declare that this function 
          // Need id from button jQuery click event 
          var result = $http.get('/Home/GetData/' + id); 
          return result; 
         }; 
        }); 

ИХМО лучший вариантом здесь будет использовать нг щелкни угловой метод на DIV, что вы Ван мыши. https://docs.angularjs.org/api/ng/directive/ngClick

Answer 2

Я могу назвать угловую функцию из JQuery с помощью следующего кода

$(".bs-example").on('click', '#alldiv a', function() { 
      var id = $(this).attr("id"); 
      var scope = angular.element(document.getElementById("my-table")).scope(); 
      scope.$apply(function() { 
       scope.save(id); 
      }); 
});