Angular: Directive Scope Binding

http://angularjs.org/

by HyunSeob Lee

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
<div ng-controller="myCtrl">
  <my-directive author="author"></my-directive>
</div>

CSS

div {
  color: white;
}

JavaScript

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

myApp.controller('myCtrl', ['$scope', function ($scope) {
  $scope.author = {
  	name: 'hyunseob',
    age: 27
  };
}]);

myApp.directive('myDirective', function() {
  return {
    restrict: 'E',
    scope: {
    	author: "="
    },
    template: '<div>My name is {{ author.name }}.</div><div>{{ author.age }} years old.</div>',
    link: function(scope) {
      scope.data = 'BBB';
    }
  }
});