Detailed explanation: Get $scope directly outside AngularJS controller

I used to write a script that automatically sends messages using webqq. Since webqq directly used technology similar to jQuery to operate DOM at that time, the script was very simple to implement.

Nowadays, many web applications have begun to use AngularJS. MVVM causes it to be unable to operate the dom and directly change the data. So when facing the web version of WeChat, if you want to implement an automatic sending script, you can no longer use the previous DOM ideas.

To modify data in AngularJS, you must first get scope. In fact, the method to obtain scope is very simple.

Since most Angular projects need to use jQuery as a supplement. You can obtain the domain inherited in the current selector content through the .scope() method in jQuery.

That is, a similar method:

$('div[ng-controller="listController"]').scope();

Example: Complete example.

<!DOCTYPE html>
<html lang="en" ng-app="app">
<head>
  <meta charset="UTF-8">
  <title>Get angular's scope in jQuery</title>
  <script src="/jquery/2.1.4/"></script>
  <script src="//1.4.3/"></script>
  <script>
    ('app',[])
        .controller('listController',['$scope', function ($scope) {
          $ = [1,2,3,4,5];
          $ = function () {
            ('test');
          }
        }])
  </script>
  <script>
    $(document).on('ready', function () {
      var controllerScope = $('div[ng-controller="listController"]').scope(); // Get controller's scope
      (); // log 'test'
      (); // log [1,2,3,4,5]
      $('button').click(function (e) {
        var scope = $().scope();
        () // log item number
        (); // log 'test'
      })
    })
  </script>
</head>
<body>
<div ng-controller="listController">
  <ul>
    <li ng-repeat="item in list"><button>Select {{item}}</button></li>
  </ul>
</div>
</body>
</html>

Then open the web version of WeChat page (2016-06-05) and select the person you need to send a message. Then execute the following script:

var controllerScope = $('div[ng-controller="chatSenderController"]').scope(); 
  // Get the $scope of the chatSenderController = "Good afternoon, Brother Xing";  // Set the message to be sent.  That is, set the value of a certain property of $scope.
// Trigger the click event of the "Send Button".$(".action a").trigger("click");

Very good way.

The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.