Как создать правильный переключатель в угловом контроллере с помощью EventListener для тела?

Question

Я пытаюсь добавить прослушиватель событий по клику для тела в контроллере.Для этого я добавил функцию, которая должна инвертировать переменную is_shown .Проблема в том, что переменная is_shown не стала инвертированной.

Возможно ли инвертировать переменную is_shown только в контроллере без добавления директивы, такой как "ng-click"?

Угловая версия - 1.6.2

<div ng-app="myApp" ng-controller="myCtrl">
    <p>{{is_shown}}</p>
</div>

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {

    $scope.is_shown = false;

    $scope.toggleCont = function(){
        alert('fired');
        $scope.is_shown = !$scope.is_shown;
    };

    var body = angular.element(document.querySelector('body'));

    body.on("click", function (e) {
        $scope.toggleCont();
    });

* В режиме отладки Chrome переменная is_shown становится инвертированной, но изменения p не применяются.

Answer 1

Вам необходимо добавить $scope.$apply(); после вызова функции переключения.body.on () не является угловым событием, поэтому оно необходимо для обновления значений.Но это не лучший способ добиться того, чего вы хотите.Вы можете создать директиву, прикрепить ее к элементу body и выполнить там работу следующим образом (функция внутренней ссылки):

element.on("click", (e: JQueryEventObject) => {

});