Angular JS - Exposing Controller Function outside the module via onClick function call

Exposing Controller Function outside the module via onClick function call For re-using already defined onClick functions Orinal: http://jsfiddle.net/austinnoronha/nukRe/light/

by Roger Ramos

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<div ng-cloak ng-app="ManagerApp">
    <div id="MainWrap" class="container" ng-controller="ManagerCtrl"> <span class="label label-info label-ext">Exposing Controller Function outside the module via onClick function call</span>

        <button onClick='ajaxResultPost("Update:Name:With:JOHN","accept",true);'>click me</button>
        <br/> <span class="label label-warning label-ext" ng-bind="customParams.data"></span>

        <br/> <span class="label label-warning label-ext" ng-bind="customParams.type"></span>

        <br/> <span class="label label-warning label-ext" ng-bind="customParams.res"></span>

        <br/>
        <input type="text" ng-model="sampletext" size="60">
        <br/>
    </div>
</div>

JavaScript

var angularApp = angular.module('ManagerApp', []);
    angularApp.controller('ManagerCtrl', ['$scope', function ($scope) {

    $scope.customParams = {};

    $scope.updateCustomRequest = function (data, type, res) {
        $scope.customParams.data = data;
        $scope.customParams.type = type;
        $scope.customParams.res = res;
        $scope.sampletext = "input text: " + data;
    };



    }]);

    function ajaxResultPost(data, type, res) {
        var scope = angular.element(document.getElementById("MainWrap")).scope();
        scope.$apply(function () {
        scope.updateCustomRequest(data, type, res);
        });
    }