Simple directive

by Uday Hiwarale

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
	<car tires="tires"></car>
</div>

JavaScript

angular
	.module('myApp', [])
	.controller('myCtrl', function($scope){
		$scope.tires = 2;
	})
	.directive('car', function(){
		return {
			restrict : 'E',
			scope : {
				tiresCount : '=tires'
			},
			controller : function($scope){
				console.log('tiresCount from $scope : ' + $scope.tiresCount);
				console.log('tiresCount from controller : ' + this.tiresCount);
			},
      		bindToController : true,
      		controllerAs : '$ctrl',
					template : '<b>I am car with {{$ctrl.tiresCount}} tires.</b>'
		}
	});