Can I not change html tag using AngularJS? -

Can I not change html tag using AngularJS? -

in angularjs, trying user type info in input field , alter tag accordingly. if user types in 2, h2 tag appear.. if 3, h3. learning angularjs. doesnt seem work... making mistake?

<h{{data.message}} class="text-left"> lesson # {{5%3}} b</h1> <input id="firstname" name="firstname" type="text" class="form-control input-md" value="" ng-model="data.message">

you can not have databinding on element tags. behavior should create custom directive recreates element on data.message change.

.directive('heading', function($compile) { homecoming { transclude: true, restrict: 'e', compile: function($element, $attr) { homecoming function($scope, $element, $attr) { // create new element here $attr.number $scope.$watch(function() { homecoming $attr.msg }, function() { var msg = $attr.msg, element = angular.element('<h'+msg+' ng-transclude></h'+msg+'>'); // replace newly created element $element.replacewith(element); $compile($element)($scope); }); } } } });

usage: <heading msg="data.message"> lesson # {{5%3}} b</heading>

it should similar, however, didn't test it, believe that's way go..

angularjs