如何通过角度js中图像的最小高度设置列表中图像的高度？

Question

我目前正在研究 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 高度 = 200 像素。 img2 高度 = 100 像素。 img3 高度 = 90 像素。 img4 高度 = 260 像素。 img5 高度 = 120 像素。

运行代码后，img高度变为90

img1 高度 = 90px img2 高度 = 90px img3 高度 = 90px img4 高度 = 90px img5 高度 = 90px

我该怎么做？ 另外，如何在 Angular js 中选择元素，如在 jquery 中选择元素？ 感谢您的回复。

Answer 1

这将选择所有具有“.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
})