Angularjs calls the $ scope.function function from a simple JS function

Question

I'm trying to implement google recapcha, I can check if the user is a person with his help,

The reCapcha code calls the callback function named 'verifyCallback'in of my code. Next I want to call the AngularJS function written in the area of ​​my controller.

Here are my codes so far -

Main Html, I turned on -

<script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit" async defer></script> 

Html partial -

  var onloadCallback = function() { grecaptcha.render('loginCapcha', { 'sitekey' : 'someKey', 'callback' : verifyCallback, 'theme':'dark' }); }; var verifyCallback = function(response) { //I get a response if user is able to solve the Capcha challenge console.log(response); //I want to call the function called 'auth' written in my AngularJS controller var scope = angular.element(document.getElementById('#loginCapcha')).scope(); scope.auth(); }; <div id="loginCapcha"></div> 

AngularJS Controller -

 var _myApp = angular.module('homeApp',[]); _myApp.controller('loginController',['$scope', function($scope){ $scope.auth = function() { console.log("Auth called"); } }]); 

Answer 1

 <div ng-controller='loginController' id='yourControllerElementID'> </div> 

In the above scenario, use the following code:

 var scope = angular.element(document.getElementById('yourControllerElementID')).scope(); scope.auth(); 

So your method will look like this:

 var verifyCallback = function(response) { //I get a response if user is able to solve the Capcha challenge console.log(response); //I want to call the function called 'auth' written in my AngularJS controller var scope = angular.element(document.getElementById('#yourControllerElementID')).scope(); scope.auth(); };