AngularJS - how to exchange data between a directive and controller
Code for tutorial at http://creative-punch.net
by Prajeesh_PR
HTML
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script src="http://code.angularjs.org/1.0.0/angular-1.0.0.js"></script>
<div ng-app="myApp">
<div ng-controller="myCtrl">
<div counter model="count"></div>
{{count}}
</div>
</div>
JavaScript
var app = angular.module('myApp', [])
app.directive('counter',
function($timeout) {
return {
scope: {
internalCount: '=model'
},
link: function($scope, element) {
function addCount() {
$timeout(function() {
$scope.internalCount += 1;
addCount();
}, 1000)
}
addCount();
}
};
}
)
app.controller('myCtrl', function($scope) {
$scope.count = 0;
});