角。删除根标记上的属性

时间:2014-05-15 09:46:00

标签: javascript html css angularjs

我将自己的标签转换为模板:

<div>
    <input />
    <span></span>
</div>

在我自己的标签中,我只为input设置了属性。

但是div也有这个属性。我无法删除它。我尝试使用element.removeAttr('class'),但它不起作用。

demo plunker

<!DOCTYPE html>
<html ng-app="sr">
<head>
<meta charset="utf-8" />
<title>single root tag</title>
<style>
body {background:gray;}
.red {background:red;}
.green {background:green;}
.yellow {background:yellow;}
</style>
<script src="dhtmlxcommon.js"></script>
<script src="dhtmlxcalendar.js"></script>
</head>
<body>
    <tag class="{{class}}" width="{{width}}" ></tag><br>
    <tag class="{{class}}" width="{{width}}" ></tag><br>
    PutIn value for <b>class</b> <input ng-model="class" />red green<br><br>
    PutIn value for <b>width</b> <input ng-model="width" />any number
<br>    
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.1.3/angular.min.js"></script>
<script>
var myapp = angular.module("sr", []);

myapp.directive('tag', function(){
    return {
      restrict: 'E',
      replace: true,
      transclude: false,
      scope: false,
      template: 
      '<div><input type="text" ng-model="fdg" class="{{class}}" size="{{width}}" ></input><span>text must be here</span></div>'
      ,
        link: function(scope, element, attrs) {
            //element.find('input').attr('attr1', '{{value1}}');
            //element.find('div').removeAttr('class');
            element.removeAttr('class');
            element.removeAttr('width');
        }
    };
});
</script>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

只需从class="{{class}}" width="{{width}}"移除<tag>,例如:http://plnkr.co/edit/f0UidePGJEwp1bep4gUj?p=preview

<tag></tag><br>
<tag></tag><br>