Why does transclude not work with input?

Question

JavaScript

Hello.
There is an input:

<input type="text" name="name" value="0" rt-number/>

There is a directive:

angular.module('Wasya').directive('rtNumber', function(){
return {
restrict : 'A',
link : function($scope, el, attr){/*тут всякий код*/},
template: '<div class="wrap" ng-transclude></div>', // и если <ng-transclude></ng-transclude> тоже не работает
transclude : true,
scope : {}
};
});

Doesn't work with input , works with div , span, sub . Didn't check with others.
I ask for help, otherwise it's already infuriating as hell.
Yes, and the result of working with input is a template wrapped by input .
Result to get:

<div class="wrap" ng-transclude>
    <input type="text" name="name" value="0" rt-number/>
</div>

Answer 1

And what result do you expect? And what do you get when the div element?
transclude serves to substitute the contents of the element on which the directive is hung in ng-transclude.
And when you hang it on an imput, the imput remains and template is inserted into it. Although it's strange, why bother with the imput tag at all, it's not right at all.

Answer 2

See what you want to do.....

<!-- before directive -->
<input type="text" name="name" value="0" rt-number />

<!-- after directive -->
<input type="text" name="name" value="0" rt-number>
   <div class="wrap" ng-transclude></div>
</input>

Describe in detail what result you want to get - I'll try to help.

Answer 3

You "can't" put elements inside the input, here you need to replace the input with a template, you can do this in Angular Light .