首页 文章

父元素在其子元素之前就已准备好 - Polymer 1.0

提问于
浏览
2

This question had been modified to match the actual problem.

原始问题错误地集中在iron-ajax上,请参阅下面的原始问题 . 问题应该是:

请告诉我们为什么在my-component的'ready'回调期间没有准备好孩子iron-ajax元素,定义如下:

<dom-module id="my-component">
    <template>
        <link rel="import" href="../../../bower_components/iron-ajax/iron-ajax.html">
        <iron-ajax
            id="selectionLoader"
            url=""
            method="GET"
            handle-as="json"
            debounce-duration="300"
            last-response="{{ suggestedOptions }}"
            last-error="{{ lastError }}"
            verbose=true
        >
        </iron-ajax>
    </template>
</dom-module>

<script>
    (function () {
        Polymer({
            is : 'paper-select',
            ready : function() {
                console.log(this.$.selectionLoader.generateRequest); // undefined
            }
        })
    })()
</script>

Original question

原 Headers :'WebComponentsReady'在铁-ajax准备好之前开火 - 聚合物1.0

我需要为自定义组件的观察属性分配一些值,内部使用带有禁用auto的iron-ajax - 所以我需要在iron-ajax元素上调用.generateRequest . 这应该在主机页面/组件准备就绪时发生,以便根据主机组件代码中的数据从服务器获取一些默认值 .

selected是观察到的组件上的数组属性,如下所示:

observers: [
    '_selectedChanged(selected.splices)' // _selectedChanged calls .generateRequest
]

观察者由以下因素触发:

window.addEventListener('WebComponentsReady', function() {
    document.querySelector('paper-select').selected = [{id : 11855},{id : 11856}];
});

问题是WebComponentsReady之前触发.generateRequest在iron-ajax上可用 . 所以我的组件被初始化,_selectedChanged被调用,但其中的iron-ajax缺少方法,实际上也缺少其他属性/方法 .

我在组件中使用了setTimeout实现了一个“延迟”的解决方法,它就像魅力一样,但显然不是这样 . 如果观察者在页面加载后的一段时间被触发,例如,一切都有效 . 通过用户的输入 . 这表明逻辑有效,只是错误的时机 .

我错过了什么?

1 回答

  • 0

    真正的问题是在我的组件的<template>中有html导入 . “错误的”事件顺序是有道理的,因为当主机调用“准备好”回调时,甚至没有注册铁-ajax .

    我已经将导入移到了<dom-module>之外,现在一切都按预期工作了 .

相关问题