Angular: Empty Fiddle
http://angularjs.org/
HTML
<script src="http://code.angularjs.org/angular-1.0.1.js"></script>
<div ng-controller="MyCtrl">
Hello, {{person.name}}!
<my-directive></my-directive>
</div>
JavaScript
var myApp = angular.module('myApp',[]);
//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});
function MyCtrl($scope) {
$scope.person = {name:'Dave'};
}
myApp.directive('myDirective', function() {
return {
scope: true,
restrict: 'EA',
link: function(scope, elem, attrs) {
scope.updateName = function(newName) {
console.log('newName is: ' + newName);
scope.$parent.person = {name:newName};
}
},
template: '<input ng-model="updatedName" placeholder="new name value"> <button ng-click="updateName(updatedName)">Update</button>'
}
})