Bind value to custom directive
Description
The following code shows how to bind value to custom directive.
Example
<!--from w w w.j a va 2 s . c o m-->
<!doctype html>
<!--
Created using JS Bin
http://jsbin.com
Copyright (c) 2014 by auser (http://jsbin.com/IteNita/1/edit)
Released under the MIT license: http://jsbin.mit-license.org
-->
<html ng-app="myApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular.js"></script>
</head>
<body>
<label>Their URL field:</label>
<input type="text" ng-model="theirUrl">
<div my-directive
some-attr="theirUrl"
my-link-text="Click me to go to Google"></div>
<script>
angular.module('myApp', [])
.directive('myDirective', function() {
return {
restrict: 'A',
replace: true,
scope: {
myUrl: '=someAttr',
myLinkText: '@'
},
template: '\
<div>\
<label>My Url Field:</label>\
<input type="text" ng-model="myUrl" />\
<a href="{{myUrl}}">{{myLinkText}}</a>\
</div>\
'
}
})
</script>
</body>
</html>