クロムの鉄フォームの問題

Question

アイアンフォームを使用しようとしていますが、Chromeのフォームの非ネイティブエレメントにアクセスできません。

<dom-module id="e404-view"> 
    <template> 
     <style> 
      :host { 
       display: block; 

       padding: 10px 20px; 
      } 

     </style> 

     <form id="step1Form" is="iron-form"> 
      <input> 
      <paper-input></paper-input> 
     </form> 

     You hit a 404. <a href="/home">Head back to home</a> 
    </template> 

    <script> 
     Polymer({ 
      is: 'e404-view', 

      ready: function() { 
       var form = this.$.step1Form; 
//    console.log(form.elements); 
       for (var el, i = 0; el = form.elements[i], i < form.elements.length; i++) { 
        console.log(el); 
       } 
      } 
     }); 
    </script> 
</dom-module> 

ここでは、フォームが含まれている簡単な図です。 Chromeのform.elementsを繰り返し処理すると、配列内に入力が1つしかありません。しかし、この例はFirefox上で完璧に動作します。

私はアプリケーションを構築しています。私は別のプロジェクトで同じビューを使用するとすべてうまく動作します。私は、アプリに何か衝突があるか、そういうものがあると思う。このビューはアプリ内のアイアンページを介して表示されます。しかし、私はそれがFirefox上で動作する理由はわかりません。

私は何が間違っているのか分かりませんし、アドバイスやヒントをいただければ幸いです。バグを解決できない場合は、おそらくフォームを削除して、自分で検証を処理します。

ありがとうございます。Jan

Answer 1

解決策が見つかりました。この問題は、index.htmlにあるグローバルなポリマー設定によって引き起こされました。私は、DOMをコメントアウト

window.Polymer = { 
     dom: 'shadow', 
     lazyRegister: true 
    }; 

： '影' の設定は、すべてが働き始めた

はここでは問題の部分です。