width返回ok但height返回0

时间:2016-09-26 16:13:03

标签: javascript angularjs

我在控制器“myController”里面有一个角度来计算一些点来绘制图像叠加层:

    $scope.width = document.getElementById('imageId').clientWidth;
    $scope.image_height = document.getElementById('imageId').clientHeight;
  $(window).resize(function() {
        $scope.$apply(function() {
            //do something to update current scope based on the new innerWidth and let angular update the view.
            $scope.image_height = document.getElementById('imageId').clientHeight;
            $scope.image_width = document.getElementById('imageId').clientWidth;
            $scope.x = 20 - ((30 / 2) / $scope.image_width * 100);
            $scope.y = 30 - (30 / $scope.image_height * 100);
            $scope.x += '%';
            $scope.y += '%';
            console.log("x: " + $scope.x + "y: " + $scope.y);
        });
    });

这个html:

<div style="position:relative" ng-controller="myController">
    <div> <img id="imageId" src="mysrc" width="100%" height="100%"> </div>
    <div style="position:absolute; left:40%; top:20%;">
    </div>
</div>
width: {{width}} <br> height: {{image_height}}

宽度返回正常但高度始终返回0,直到我调整屏幕大小。我不明白为什么clientWidth返回正常,clientHeight返回0直到调整大小。我试着加载,ng-init,document.ready ...所有的可能性,没有工作....

0 个答案:

没有答案