Angular: Empty Fiddle

http://angularjs.org/

HTML

<div ng-controller="MyCtrl">
    <input type="text" my-directive="test">
    <hr/>{{test}}</div>

JavaScript

var myApp = angular.module('myApp', []);

myApp.directive('myDirective', function () {
    return {
        restrict: 'A',
        compile: function (tElement, tAttrs) {
            // for some unknown-to-me reason, the input must
            // be wrapped in a span or div:
            var tplElement = angular.element('<span><input></span>');
            var inputEl = tplElement.find('input');
            inputEl.attr('type', tAttrs.type);
            inputEl.attr('ng-model', tAttrs.myDirective);
            tElement.replaceWith(tplElement);
        }
    };
});

function MyCtrl($scope) {
    $scope.test = 'test';

}