Почему не работает $digest() в angularjs?

Question

[MakPET]

HTML

<div ng-controller="MainCtrl">

<div class="btn-group" tri-button counter="buttons.totalClick" >
	<button class="btn btn-default" ng-repeat="name in buttons.names">{{name}}</button>
</div>
<h5>{{buttons.totalClick}}</h5>
</div>

//  app.js

var TestApp = angular.module('TestApp', []);

// controller.js

angular.module('TestApp')
.controller('MainCtrl', ['$scope', function ($scope) {
	$scope.buttons = {
		names:['Button #1','Button #2','Button #3'],
		totalClick:0
	}
}]);

//directive.js

angular.module('TestApp')
.directive('triButton', [function () {
	return {
		scope:{counter:'=counter'},
		link: function (scope, elem, attr) {
			elem.on('click',function(event){
					scope.counter++
					scope.$digest();
					console.log(scope.counter)
			})

		}
	};
}])

в консоле увеличивается но в DOM нет
знаю такой код работает но мне нужен с digest()

elem.on('click',function(event){
					scope.$apply(scope.counter++)
					console.log(scope.counter)
			})

Answer 1

[_ _]

Потому что $digest это проверка изменений ТОЛЬКО для скоупа, на котором он вызывается. А $apply запускает проверку по всему дереву.
У вас директива создает закрытый скоуп, поэтому $digest на скоуп контроллера не распространяется.