Angular: Empty Fiddle
http://angularjs.org/
HTML
<script src="http://code.angularjs.org/angular-1.0.1.js"></script>
<script type="text/ng-template" id="armcontrol">
<div style="background-color: {{color}};" ng-transclude>{{label}}</div>
</script>
<div ng-controller="MyCtrl">
<armcontrol label="Idx" color="#0000ff">
<input type="text" value="test-me2" />
</armcontrol>
</div>
JavaScript
var myApp = angular.module('myApp', []);
myApp.directive('armcontrol', function() {
return {
restrict: "E",
replace : false,
transclude : true,
scope: {
label: "@",
color: "@"
},
templateUrl: "armcontrol"
};
})
function MyCtrl($scope) {
$scope.name = 'Superhero';
}