角度:从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时轻松访问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;

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

在模板中选择 DOM 元素

来自分类Dev

使用JS从DOM中选择元素

来自分类Dev

如何使用DOM在div中选择元素?

来自分类Dev

如何在角度分量中选择光DOM

来自分类Dev

如何在角度分量中选择光DOM

来自分类Dev

角度复选框全选或从表中选择单个元素

来自分类Dev

如何使用包含冒号的属性名称在DOM中选择元素?

来自分类Dev

使用Puppeteer和Node从DOM中选择元素

来自分类Dev

在jQuery XML文档中的DOM中选择和操作元素?

来自分类Dev

聚合物-从模板中选择DOM元素

来自分类Dev

在DataFrame中选择元素

来自分类Dev

从getElements中选择元素

来自分类Dev

在音频元素中选择

来自分类Dev

从元素中选择数字

来自分类Dev

角度访问dom元素

来自分类Dev

从DOM中选择元素,该元素不与所选e的同级

来自分类Dev

选择元素的角度聚焦

来自分类Dev

从角度选择列表中选择默认选项

来自分类Dev

在 DOM 中选择一个元素,该元素不是兄弟元素,而是在后面

来自分类Dev

在DOM元素内选择

来自分类Dev

在具有DOM的列表中选择项目的最后一个元素

来自分类Dev

AngularJS-在指令中选择动态ng-repeat DOM元素

来自分类Dev

在Jquery中选择元素的ID

来自分类Dev

在Sass中选择当前元素

来自分类Dev

从数组中选择某些元素

来自分类Dev

在xslt中选择多个元素

来自分类Dev

在python硒中选择元素

来自分类Dev

从json对象中选择元素

来自分类Dev

XSLT从嵌套元素中选择