Question

我的目的是根据高度和宽度动态添加一个类，以便它适合div的内部。这个指令是拉高度和宽度，然后添加类。我遇到的问题是它获取第一个图像的信息，并使用该数据向所有其他图像添加类。因此，所有图像都以“肖像图像”返回，即使它们需要“风景图像”。

这是我的指示

function dynamicImageDirective(){
    return {
        restrict: 'A',
        link: function(scope, elem, attr) {
            elem.on('load', function() {
                setTimeout(function(){
                    var w = $(this).width(),
                        h = $(this).height();
                    if (w > h) {
                        elem.addClass('landscape-image');
                    } else {
                        elem.addClass('portrait-image');
                    }
                },0);
            });
        }
    };
}

重复：

 <div class="fullWidth" ng-repeat="gallery in public.galleries">
     <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6 col-xl-6 right">
        <div class="fullWidth display-inlineBlock verticalCenterDiv" style="height: 325px; padding: 0px;">
            <span class="helper"></span>
            <img ng-click="openLightboxModal($index)" class="vertical-middle" number="{{$index}}" ng-show="gallery.image_url" ng-src="{{gallery.image_url}}" dynamic-image="gallery">
        </div>
     </div>
</div>

Answer 1

我能够通过将其更改为“绑定”来实现它的工作。而不是“负载”＃。

function dynamicImageDirective(){
    return {
        restrict: 'A',
        link: function(scope, elem, attr) {
            elem.bind('load', function() {
                var w = this.width;
                var h = this.height;
                if (w > h) {
                    $(this).addClass('landscape-image');
                } else {
                    $(this).addClass('portrait-image');
                }
            });
            elem.bind('error', function(){

            });
        }
    }
}

ng-repeat图像的指令仅提取有关第一张图像的信息

1 个答案: