AngularJS Isolated Scope photo
This is a fiddle designed to illustrate isolated scope using the updated and simpler syntax. This is a take on John Lindquist's fiddle which looked like this: http://jsfiddle.net/simpulton/RUbSv/
by gogirl
HTML
<div ng-app="myApp">
<div ng-init="photo.url = 'http://www.w3schools.com/js/pic_bulboff.gif'"></div>output:{{photo.url}}
<img ng-src='http://www.w3schools.com/js/pic_bulboff.gif' />
<my-d photo-src={{photo.url}} />
</div>
JavaScript
// My Main Application File
angular.module('myApp', ['myDirectives']);
// My Directives File
angular.module('myDirectives', []);
// Controller One File
angular.module('myDirectives', []).directive('myD', function () {
return {
restrict: 'E',
template: '<figure> <img ng-src="{{photoSrc}}"/> </figure>',
replace: true,
// pass these two names from attrs into the template scope
scope: {
photoSrc: '@'
}
}
})