Как вызвать обратный вызов в компоненте Polymer, когда он подключен к DOM?

Question

У меня возникли проблемы с интеграцией jsPlumb в компонент Polymer, который предназначен для использования в качестве плагина в оболочке приложения Electron. Версия Polymer, которую я использую, - 1.2.0, потому что она была поставлена ​​вместе с приложением.

jsPlumb требует, чтобы перетаскиваемые элементы, их источники и цели были смонтированы в DOM, но это не так, когда attached уволен.

Что я сделал, так это установил simeout, чтобы продолжать запрашивать DOM, пока компонент не был "по-настоящему" смонтирован, а затем продолжить инициализацию, передавая новый экземпляр jsPlumb узлам на графике, чтобы они могли правильно настроить источники и цели для каждый порт ввода и вывода.

Вопрос

Я хочу знать, есть ли другой способ "подождать" доступности компонента для jsPlumb, используя только Polymer API вместо тайм-аута?

<link rel="import" href="my-node.html">

<dom-module id="my-graph">
    <template>
        <div id="canvas">
            <template is="dom-repeat" items="{{nodes}}">
                <my-node></my-node>
            </template>
        </div>
    </template>

    <script>
        Polymer({
            is: "my-graph",
            properties: {
                nodes: {
                    type: Array,
                    value: function(){return [];}
                }
            },
            attached: function() {
                this._attachedDeferred();
            },
            _attachedDeferred: function() {
                // wait for the component to be attached
                if (!document.contains(this) || !this.offsetParent) {
                    setTimeout(function(){
                        this._attachedDeferred();
                    }.bind(this), 100);
                    return;
                }

                // ready to init jsPlumb
                this.instance = jsPlumb.getInstance({
                    Container: "canvas"
                });

                // init the graph nodes
                var nodes = [
                    {
                        pos: [0,0],
                        jsPlumb: this.instance; // the new instance of jsPlumb
                        inputs: {...},
                        outputs: {...}
                    }
                ];
                this.nodes = nodes;
            }
        });
    </script>
</dom-module>

Answer 1

Я полагаю, вы пытаетесь получить доступ к <my-node> элементы?

<template is="dom-repeat"> создает его содержимое асинхронно, поэтому его дочерние элементы не будут доступны во время attached, Вам нужно прослушать событие dom-change, прежде чем вы сможете получить к ним доступ.

Ознакомьтесь с документацией после заголовка "Время инициализации для локальных дочерних элементов DOM".