访问附件中dom-repeat内部的元素 [英] Accessing elements inside dom-repeat in attached

问题描述

我想访问dom-repeat内部的元素.在这里，el返回空数组:

<dom-module id="child-element">
    <template>
        <div id="ida">
            <ul>
                <template is="dom-repeat" items="{{user}}" id="items">
                    <li class = "classa">{{item.name}}</li>
                </template>
            </ul>
        </div>
    </template>

    <script>
        ChildElement = Polymer({
            is: 'child-element',
            factoryImpl(users) {
                this.user = users;
            },
            properties: {
                user: {
                    type: Array
                }
            },
            attached: function() {
                var el = Polymer.dom(this.root).querySelectorAll("#ida .classa");
                console.log("el",el);
            }
        });
    </script>
</dom-module>

如何从Polymer的其他位置访问dom-repeat内部的动态创建的元素?

此处是完整版本的链接.

解决方案

调用后，可能尚未初始化子级.将代码包装在异步函数中.

attached:function(){
  this.async(function() {
   // access sibling or parent elements here
     var el = Polymer.dom(this.root).querySelector("#ida .classa");
     console.log("el",el);
  });
}

开发人员指南中对此进行了记录

I would like to to have access to the elements inside of a dom-repeat. Here, el returns empty array:

<dom-module id="child-element">
    <template>
        <div id="ida">
            <ul>
                <template is="dom-repeat" items="{{user}}" id="items">
                    <li class = "classa">{{item.name}}</li>
                </template>
            </ul>
        </div>
    </template>

    <script>
        ChildElement = Polymer({
            is: 'child-element',
            factoryImpl(users) {
                this.user = users;
            },
            properties: {
                user: {
                    type: Array
                }
            },
            attached: function() {
                var el = Polymer.dom(this.root).querySelectorAll("#ida .classa");
                console.log("el",el);
            }
        });
    </script>
</dom-module>

How can I access the dynamically created elements inside the dom-repeat from elsewhere in Polymer?

Here is a link to the the full version.

解决方案

When attached is called the children may not be initialized yet. Wrap your code in an async function.

attached:function(){
  this.async(function() {
   // access sibling or parent elements here
     var el = Polymer.dom(this.root).querySelector("#ida .classa");
     console.log("el",el);
  });
}

This is documented in the Developer guide

这篇关于访问附件中dom-repeat内部的元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！