JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.js"></script>
<div ng-controller="TestController">
  <div ng-controller="TestController">
    <div ng-controller="TestController">
      <div ng-controller="TestController">
        <div ng-controller="TestController">
          <div ng-controller="TestController">
            <div ng-controller="TestController">
              <div ng-controller="TestController">
                <div ng-controller="TestController">
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

CSS

div {
  height: 20px;
  position: relative;
  border: 1px solid red;
  top: 25px;
}

JavaScript

var app = angular.module("app", []);

app.controller('TestController', class TestController {
  constructor($scope, $element) {
    this.$scope = $scope;
    this.$element = $element;
  }
  
  $onInit() {
  	// Skip logging the first digest that always occurs from $rootScope
    this.$scope.$$postDigest(() => {
    	this.$scope.$watch(() => {
        console.log(this.$scope.$id);
      });
    });
  }
  
  $postLink() {
  	this.$element.prepend('<span>' + this.$scope.$id + '</span>');
    this.$element.on('click', (e) => {
      e.stopPropagation();
    	this.$scope.$digest();
    });
  }
});