簡體   English   中英

角度:從DOM中選擇元素

[英]Angular: Selecting elements from DOM

我正在使用ng-repeat創建項目。 我想確定通過使用函數創建的每個元素的高度。

我知道如何將由ng-repeat創建的元素的索引傳遞給應該確定高度的函數,但是我在實際選擇該項目時陷入了困境。

這是我現在正在使用的:

   $scope.getItemHeight = function(index) { // index is index of element in ng-repeat
    var itemHeight = angular.element('li').eq('+index+').offsetHeight;
    return itemHeight;
   };

但這由於錯誤而無法正常工作: Error: [jqLite:nosel] Looking up elements via selectors is not supported by jqLite!

我也嘗試過:

   $scope.getItemHeight = function(index) {
    var itemHeight = document.querySelectorAll('ul:nth-child('+index+')');
    return itemHeight;
   };

這將返回長度為0的元素,因此選擇器不起作用。

我在這里想念什么?

此處的Codepen: http ://codepen.io/squrler/pen/LxsfE?editors = 101


編輯:目前我無法實現。 此處的更多信息: https : //github.com/driftyco/ionic/issues/1691

編輯:進一步研究之后,似乎有點復雜。 觸發中繼器的指令需要運行才能呈現lis,因為li被渲染(假設您將其移至指令),它將觸發指令以獲取其高度,但是li及其對應的數據是尚未完全渲染,因此沒有高度。 如果您使用超時等待渲染,則在等待超時時,中繼器將繼續在沒有有效高度數據的情況下繼續渲染。 因此,您似乎有一個難題。 您可以嘗試使用http://binarymuse.github.io/ngInfiniteScroll/或類似的方法。

這應該放在偽指令中,以便在呈現li時輕松訪問它。

就像是:

.directive('getHeight', ['$filter', function ($filter) {
    'use strict';

    return {
        restrict: 'A',
        scope: true,
        link: function (scope, element, attrs) {
            var li = element[0];
            var height = li.offsetHeight;
            console.log('Height': height)
        }
    };
}]);

確定高度后不確定要怎么做...

否則,您可以去:

var ul=document.getElementsByTagName('ul')[0];
var li=ul.getElementsByTagName('li')[index];
var height=li.offsetHeight;

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM