$scope variable

passing angular $scope variable to javascript event

HTML

<br><br>

<div ng-app="varApp" ng-controller="TodoCtrl"> 

    <ul>
        <li ng-repeat='x in tasks | limitTo: limitNumber' ng-class="{special: $index == 1}">
            <span class='fl'>{{x.Name }}</span><span class='fr'>{{x.City}}</span>
        </li>
    </ul>
    
</div>
    <br/>
<button class='fr' id='button'>stich here</button>

CSS

</style> <!-- Ugly Hack due to jsFiddle issue: http://goo.gl/BUfGZ --> 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.min.js"></script>
<style>

.ng-invalid { 
    border: 1px solid red; 
}
.special{ background: #eee; }
li{
    list-style:none;
    overflow:hidden; 
    border-bottom: 1px #999 solid;
    padding:4px}
.fr{
    float:right
}
.fl{
    float:left
}

JavaScript

angular.module('varApp', [])

.controller('TodoCtrl', function($scope, $http) {
    
    $scope.limitNumber = "data prueba";
    
});

$('#button').click(function(){
    
    var data = angular
        .element(document.querySelector('[ng-controller="TodoCtrl"]'))
        .scope()
        .limitNumber;
    
    alert(data);
            
});