Angular. How Can I Use Variable In Tagname

I am new to angular and I wrote a simple code, but it doesn't work. Can someone explain me how can i get a tagName from input value. It's a sample, of course I want to assign this

Solution 1:

I think, you may have to write a directive for the same. I've defined a directive named, render which watches the customTag model to update the DOM.

Working Demo

myApp.directive('render', function() {
    return {
        restrict: 'A',
        link: function(scope, element, attrs) {
            attrs.$observe('render', function(value) {
                if (value) {
                    element.html('<' + value + '>77</' + value + '>');      
                } else {
                    element.html(77);      
                }              
            });
        }
    };
});

Finally use it as shown below. ng-init allows you to set the default value for the model as value("b") does not work in this case.

<inputng-init="customTag='u'"type="text"ng-model="customTag"placeholder="Enter a name here"ng-change="update()"/><spanrender="{{customTag}}"></span>