<!DOCTYPE html>
<html>
<head>
<title>Wikitechy AngularJS Tutorials</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
</head>
<body>
<h2> Wikitechy Isolate Scope in AngularJS</h2>
<div ng-app="myApp" ng-controller="Controller">
<myfriend information="adam"></myfriend></br>
<myfriend information="angel"></myfriend>
</div>
<script>
var app=angular.module('myApp', [])
app.controller('Controller', ['$scope', function($scope) {
$scope.adam = { name: 'Adam', age:32, city: 'London' };
$scope.angel = { name: 'Angel', age:21, city: 'NewYork' };
}])
.directive('myfriend', function() {
return {
scope: {
friendInfo: '=information'
},
template: 'Name: {{friendInfo.name}} Age: {{friendInfo.age}} City: {{friendInfo.city}}'
};
});
</script>
</body>
</html>
