Angular - access from outside of the box

by otupman

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div ng-controller="MyCtrl">
    <p>{{message}}</p>
</div>

<button id="triggerButton">Trigger it from outside Angular</button>

JavaScript

function MyCtrl($scope, $window) {
    $scope.message = "Hello, world";
    
    $scope.updateMessage = function(message) {
        $scope.message = message;
    }
    
    $window.wrapperFunction = function(messageFromOutside) {
        console.log($scope);
        $scope.$apply(function() {
            $scope.updateMessage(messageFromOutside);
        });
    };
                     
}

$('#triggerButton').click(function() {
    window.wrapperFunction('Hi from outside'); 
});