This article describes the use of js to call function methods or variables in Angular controller externally. Share it for your reference, as follows:
<!DOCTYPE html><html ng-app="myApp" id="myApp"><head> <meta name="viewport" content="width=device-width" /> <title>Test</title> <script src="~/Content/Js/Plugins/AngularJS/angular.min.js"></script></head><body ng-controller="myController"> {{msg}} <a href="javascript:;" id="lbtnTest">Call</a></body></html><script> var ngApp = angular.module('myApp', []); ngApp.controller('myController', function ($scope, $http) { $scope.msg = 'Hello, Angular!'; $scope.getData = function () { return 'qubernet'; } }); onload = function () { document.getElementById('lbtnTest').onclick = function () { //Get Angular application through controller var appElement = document.querySelector('[ng-controller=myController]'); //Get $scope variable var $scope = angular.element(appElement).scope(); //Calling the msg variable and changing the value of msg $scope.msg = '123456'; //The previous line changed the value of msg. If you want to synchronize to the Angular controller, you need to call the $apply() method, $scope.$apply(); //Calling the getData() method in the controller console.log($scope.getData()); } }</script>The effect is shown in the figure below before clicking the "Call" button:
After clicking the "Call" button, the effect is shown in the following figure:
I hope this article will be helpful to everyone's AngularJS programming.