正在删除角度视图属性中的空间

Removing space in view attribute in angular

本文关键字:属性 空间 视图 删除      更新时间:2023-09-26

我有一个ng repeat指令,在该指令中我动态设置高度

 <ul>
<li ng-repeat="val in values" height-dir >{{val.a}}</li>
</ul>
    app.directive('heightDir',function(){
return {
    restrict: 'AE',
    replace: true,
    template: '<li ng-repeat="val in values" style="height:{{val.b}}%" >{{val.a}}</li>',
    link: function(scope, elem, attrs) {
    }
  };
});
$scope.values= [{a:"Doe",b:10},{a:"bom",b:20},{a:"kal",b:30},{a:"jijo",b:40}];

问题是,当我运行时,值和%之间有一个间隙,所以没有应用样式。如何解决这个问题,我遗漏了什么?非常感谢。

我认为这与生成错误的HTML标记有关。

视图:

<div ng-controller="MyCtrl">
    <ul style="height:500px">
        <height-dir ng-repeat="val in values"></height-dir>
    </ul>
</div>

代码:

var myApp = angular.module('myApp',[]);
myApp.directive('heightDir',function(){
    return {
        restrict: 'AE',
        replace: true,
        template: '<li style="height:{{val.b}}%" >{{val.a}}</li>',
        link: function(scope, elem, attrs) {
    }
  };
});
function MyCtrl($scope) {
    $scope.values= [{a:"Doe",b:10},{a:"bom",b:20},{a:"kal",b:30},{a:"jijo",b:40}];
}

Fiddle:http://jsfiddle.net/HB7LU/12044/