有沒有辦法在Angularjs的指令中獲取子元素的寬度和高度

Question

我使用帶有模板的angularjs指令將div附加到元素。 CSS使用最大寬度自動設置其寬度樣式。 如何找到此寬度進行進一步處理？ 我試過了：

for(var i=0; i<numchild; i++){
    angular.element(element.children()[i]).clientWidth
}

但這返回未定義。 有什么方法可以獲取所有孩子的尺寸（高度和寬度）？

指令和模板的整個javascript代碼如下：

angular.module('components', [])
    .directive('mydir', function () {
        numchild = 5
        return {
            restrict: 'E',
            replace: true,
            link: function(scope, element, attr) {
                for(var i=0; i<numchild; i++){
                    if(i==0){
                        element.append('<div class="myclass" style="display:table">Random</div><br>');
                    }
                    else {
                        element.append(
                            '<div class="myclass" style="display:table">Random noise here and there and everywhere around us</div><br>'
                        )
                    }
                    console.log(angular.element(element.children()[i]).clientWidth);
                }
            }
        }
    })

angular.module('MyApp', ['components'])

使用jsfiddle對此進行了更新： http : //jsfiddle.net/z55a9/2/

Answer 1

console.log(angular.element(element.children()[i])[0].clientWidth);

是您想要的，但是您也正在遍歷<br>標記，因此numchild=5是錯誤的。 （您有5個div和5個br）。