jennysjottings/index.html

## index.html
<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body ng-app="myApp">
<div ng-controller="myController">
    <div my-directive
         text="Hello {{ parentProperty2 }}!"
         attribute-for-one-way-bind="parentProperty1"
         attribute-for-two-way-bind="parentProperty2">
    </div>
</div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular.js"></script>
<script>
    angular.module("myApp",[])
            .directive("myDirective", function () {
                return {
                    restrict: "A",
                    scope: {
                        text: "@",                                       // Attribute name is optional if attribute has same
                        oneWayBoundProperty: "&attributeForOneWayBind",  // name as property on isolated scope.  (If you do
                        twoWayBoundProperty: "=attributeForTwoWayBind"   // specify the name, remember to camelCase it.)
                    },
                    link: function (scope) {
                        var temp = scope.oneWayBoundProperty(); // A one-way bound property has to be called as a function
                        scope.twoWayBoundProperty = "Jenny";  // This will also change parentProperty2
                    },
                    template: 'My text is "{{ text }}" <br> My oneWayBoundProperty is "{{ oneWayBoundProperty() }}" <br> My twoWayBoundProperty is "{{ twoWayBoundProperty }}"'
                };
            }).controller("myController", function ($scope) {
                $scope.parentProperty1 = "World";
                $scope.parentProperty2 = "User";
            });
</script>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<title></title>
	</head>
	<body ng-app="myApp">
	<div ng-controller="myController">
	<div my-directive
	text="Hello {{ parentProperty2 }}!"
	attribute-for-one-way-bind="parentProperty1"
	attribute-for-two-way-bind="parentProperty2">
	</div>
	</div>
	</body>
	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular.js"></script>
	<script>
	angular.module("myApp",[])
	.directive("myDirective", function () {
	return {
	restrict: "A",
	scope: {
	text: "@", // Attribute name is optional if attribute has same
	oneWayBoundProperty: "&attributeForOneWayBind", // name as property on isolated scope. (If you do
	twoWayBoundProperty: "=attributeForTwoWayBind" // specify the name, remember to camelCase it.)
	},
	link: function (scope) {
	var temp = scope.oneWayBoundProperty(); // A one-way bound property has to be called as a function
	scope.twoWayBoundProperty = "Jenny"; // This will also change parentProperty2
	},
	template: 'My text is "{{ text }}" <br> My oneWayBoundProperty is "{{ oneWayBoundProperty() }}" <br> My twoWayBoundProperty is "{{ twoWayBoundProperty }}"'
	};
	}).controller("myController", function ($scope) {
	$scope.parentProperty1 = "World";
	$scope.parentProperty2 = "User";
	});
	</script>
	</html>