2017-04-26 10 views
0

PolymerでカスタムWebコンポーネントを使用している場合は、テンプレートを(index.htmlの)メインDOMの一部にすることは可能ですか?影?Polymer 1.x Polymer Web Componentをグローバルにスコープする方法

スクリプトによってアクティブ化された入力にフックしようとしていますが、スクリプトはシャドウDOMを認識できません。

<link rel="import" href="../../bower_components/polymer/polymer.html"> 

<dom-module id="custom-element"> 

<template> 

    // Code to be scoped for index.html 

    <div id="script-selects-this-id-and-converts-div-to-input"></div> 

</template> 

    <script> 

    Polymer({ 

     is: 'custom-element' 

    }); 

    </script> 

</dom-module> 

答えて

0

もちろん、ウィンドウオブジェクトを指すこともできます。これは、shadow domがどのように動作するかではなく、制御可能なライブラリがあれば、これは解決策に過ぎません。あなたはconsole.log(window.reference)しようとした場合、あなたが全体のカスタム要素

+0

ときI '' 'はconsole.log(window.reference)がある見ることができます

ready: function() { window.reference = this; } 

: ので、カスタム要素のスクリプト内で次のような何かを行うことができます'' '、要素はDev Toolsに埋め込まれますが、要素自体にはまだスクリプトが見つけることができない' '#shadow-root''があります。 '' 'window.reference = this.shadowRoot'''のようなことをすることは可能ですか? – KVNA

+0

私は '' 'this.shadowRoot.innerHTML''のセレクタに近づいているようです。 – KVNA

+0

'this.shadowRoot'でそれを行うと、' .querySelector'、 'getElementById'などを呼び出すことができるhtmlが得られますので、どこに問題があるのか​​わかりません。あなたのライブラリが何をしているのか、それがどのように要素を見つけるのですか? –

関連する問題