AngularJS Understanding Isolate Scope

Egghead.io - 16

by TahmidTanzim

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/css/bootstrap-combined.min.css">
<div ng-controller="myCtrl">
 <kid done="logChore()"></kid>
</div>

JavaScript

var App = angular.module("myApp",[]);

App.controller("myCtrl",["$scope",function($scope){
    $scope.logChore = function(){
        alert("Chore is Done!");
    };
}]);

App.directive("kid",function(){
    return {
        restrict: "E",
        scope: {done:"&"},
        template: '<input type="text" ng-model="chore"> {{chore}} <div class="btn" ng-click="done()"></div>'
    };
});