Today I am learning directive in that i found compile and link functions. But I tried my link function is not working.
My code is
<body ng-app="myModule" ng-controller="myController"> this is directive<br /> <input id="inputTextColor" ng-model="color" type ="text"/>{{color}} <br /> <hello> oldertext oldertext </hello> </body> <script> var myModule = angular.module("myModule", []); myModule.directive("hello", function () { var directive = {}; directive.restrict = 'E'; directive.template = '<b>hi its me <span ng-transclude></span></b>'; directive.transclude = true; directive.compile = function (element, attributes) { element.css('border', 'solid 1px black'); var linkfunction = function ($scope, element, attributes) { element.css('background-color', $scope.color); } return linkfunction; } return directive; }); myModule.controller("myController", function ($scope) { $scope.color = "red"; }); </script> Here I want if I write colorname in textbox then background-color of my directive should update because textbox is bind to my scope.color.