我有一个 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/
关于javascript - 删除 Angular View 属性中的空间,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29209830/