javascript
  • html
  • angularjs
  • 2017-08-09 50 views 0 likes 
    0

    我目前正在研究角度js和我有一个问题,在图像的高度设置div中的最小高度...顺便说一下,我在li中使用ng-repeat。这是我的代码:如何通过角度js中图像的最小高度来设置列表中图像的高度?

    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

    我该怎么办呢? 另外,如何选择角js中的元素,如选择jQuery中的元素? 谢谢你的回应。

    回答

    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({ 
        // all the code above 
    }) 
    
    +0

    在哪里shoud我把这个c颂?在控制器或指令? –

    +0

    在控制器中,通常 – Maxwellt

    +0

    我尝试这个选择器,但它不工作。 var images = angular.element(document.querySelector('。card img'));我做错了什么? –

    相关问题