我目前正在学习 Angular JS,在通过 div 中的最小高度设置图像高度时遇到问题...顺便说一句,我在 li 中使用 ng-repeat。这是我的代码:
app.directive("cardListStyle01",function(){
return {
template: `
<li class='contentContainer02 card' ng-repeat='d in data'>
<div class='imageBlock'>
<div class='logo'><img src='/images/img0{{$index%5+1}}.jpg' alt=''></div>
<h3 class='cardTitle cWhite'>{{d.name}}</h3>
</div>
<div class='cardContentBlock'>
<p class='cardPar'>{{d.employeeNum}}</p>
</div>
</li>
`
}
})
我想要的是例如:
img1 height = 200px. img2 height = 100px. img3 height = 90px. img4 height = 260px. img5 height = 120px.
运行代码后,img高度将变为90
img1 height = 90px img2 height = 90px img3 height = 90px img4 height = 90px img5 height = 90px
我该怎么做? 另外,如何像在 jquery 中选择元素一样在 Angular js 中选择元素? 感谢您的回复。
最佳答案
这将选择具有“.my-image”类的所有项目。
var images = document.querySelectorAll('.my-image');
然后找到最小值:
var minHeight = images[0].offsetHeight;
images.forEach(function(item){
minHeight = Math.min(minHeight, item.offsetHeight)
})
然后只需设置所有元素的高度:
images.forEach(function(item){
angular.element(item).css({
height: minHeight + 'px'
});
})
如果它不起作用,请在加载 html 后使用 $timeout 执行这些操作:
$timeout({
// all the code above
})
关于javascript - 如何通过 Angular js中图像的最小高度设置列表中图像的高度?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45581763/