未在自定義元素中顯示的聚合物1.0下拉列表

Question

我在聚合物應用程序的多個位置使用了紙張下拉菜單。它在最頂層的文件（index.php）中效果很好。但不知何故，它不適用於所有自定義元素。我一定在做錯事，因爲我找不到其他人在網上抱怨這個問題。有人可以看看這個元素並告訴我它是否正確嗎？

<link rel="import" href="../../bower_components/polymer/polymer.html"> 
<link rel="import" href="../../bower_components/iron-icons/iron-icons.html"> 
<link rel="import" href="../../bower_components/iron-icon/iron-icon.html"> 
<link rel="import" href="../../bower_components/iron-dropdown/iron-dropdown.html"> 
<link rel="import" href="../../bower_components/iron-icons/social-icons.html"> 
<link rel="import" href="../../bower_components/iron-icons/communication-icons.html"> 

<link rel="import" href="../../bower_components/paper-card/paper-card.html"> 
<link rel="import" href="../../bower_components/paper-item/paper-item.html"> 
<link rel="import" href="../../bower_components/paper-input/paper-input.html"> 
<link rel="import" href="../../bower_components/paper-dropdown-menu/paper-dropdown-menu.html"> 
<link rel="import" href="../../bower_components/paper-menu/paper-menu.html"> 
<link rel="import" href="../../bower_components/paper-button/paper-button.html"> 
<link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html"> 
<link rel="import" href="../../bower_components/paper-styles/paper-styles-classes.html"> 

<link rel="import" href="../users-data/users-data.html"> 

<link rel="import" href="../../styles/shared-styles.html"> 

<dom-module id="account-user-add"> 
<template> 
    <style include="shared-styles"> 
     :host { 
      display: block; 
     } 
     *, ::after, ::before { 
      box-sizing: border-box; 
     } 
    </style> 

    <users-data users="{{users}}"></users-data> 

    <paper-card> 
     <div class="card-content"> 
      <!-- Contact photo area --> 

      <div class="row padded"> 
       <div class="col s4 m3 l2"> 
        <img class="circle responsive-img" src="[[user.avatar]]"> 
       </div> 
       <div class="col s8 m9 l10 padded"> 
        <h3> 
         <span>[[user.firstName]]</span> 
         <span>[[user.lastName]]</span> 
        </h3> 
        <div class="layout horizontal"> 
         <span>[[user.group]]</span> &nbsp;&nbsp;·&nbsp;&nbsp; <span>Active</span> 
        </div> 
       </div> 
      </div> 



      <!-- Contact form --> 
      <div id="contactForm"> 


       <!-- Group --> 
       <div class="formRow layout horizontal"> 
        <paper-dropdown-menu class="flex" label="Permission level"> 
         <paper-menu attr-for-selected="value" selected="{{user.group}}" class="dropdown-content"> 
          <paper-item value="Admin">Admin</paper-item> 
          <paper-item value="User">User</paper-item> 
         </paper-menu> 
        </paper-dropdown-menu> 
       </div> 

       <!-- Name --> 
       <div class="formRow layout horizontal"> 
        <paper-input value="{{user.firstName}}" class="item item-input flex" label="First name"></paper-input> 
        <paper-input value="{{user.lastName}}" class="item item-input flex" label="Last name"></paper-input> 
       </div> 

       <!-- Avatar --> 
       <div class="formRow layout horizontal"> 
        <paper-input value="{{user.avatar}}" class="item item-input flex" label="Avatar"></paper-input> 
       </div> 

       <!-- Phone --> 
       <div class="formRow layout horizontal"> 
        <paper-input value="{{user.telephone}}" class="item item-input flex" label="Phone"></paper-input> 
       </div> 

       <!-- Email --> 
       <div class="formRow layout horizontal"> 
        <paper-input value="{{user.email}}" class="item item-input flex" label="Email"></paper-input> 
       </div> 

       <!-- Address --> 
       <div class="formRow layout horizontal"> 
        <paper-input value="{{user.address}}" class="item item-input flex" label="Address"></paper-input> 
       </div> 

       <!-- Save --> 
       <div class="formRow buttons"> 
        <paper-button on-tap="_saveUser" raised><iron-icon icon="save"></iron-icon> Save</paper-button> 
       </div> 

      </div> 
     </div> 

    </paper-card> 
</template> 
<script> 
    (function() { 
     //'use strict'; 

     Polymer({ 
      is: 'account-user-add', 

      properties: { 
       users: { 
        type: Array 
       }, 
       user: { 
        value: {}, 
        type: Object 
       } 
      }, 
      _saveUser: function (event) { 
       this.push('users', this.user); 
       this.user = {}; 
       page('/account-users'); 
      } 
     }); 
    })(); 
</script> 
</dom-module> 

Answer 1

看來工作，當你在一個簡單的文件隔離紙下拉菜單：

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <title></title> 
    <link rel="import" href="bower_components/polymer/polymer.html"> 
    <link rel="import" href="bower_components/paper-card/paper-card.html"> 
    <link rel="import" href="bower_components/paper-dropdown-menu/paper-dropdown-menu.html"> 
    <link rel="import" href="bower_components/paper-menu/paper-menu.html"> 
    <link rel="import" href="bower_components/paper-item/paper-item.html"> 
</head> 
<body> 
    <dom-module id="account-user-add"> 
     <template> 
      <paper-card> 
       <div class="formRow layout horizontal"> 
        <paper-dropdown-menu class="flex" label="Permission level"> 
         <paper-menu attr-for-selected="value" class="dropdown-content"> 
          <paper-item value="Admin">Admin</paper-item> 
          <paper-item value="User">User</paper-item> 
         </paper-menu> 
        </paper-dropdown-menu> 
       </div> 
      </paper-card> 
     </template> 
     <script> 
      Polymer({ 
       is: "account-user-add" 
      }) 
     </script> 
    </dom-module> 
    <account-user-add> 

    </account-user-add> 
</body> 
</html> 

Answer 2

這很奇怪。它似乎工作在This example

我什麼也沒做，但發佈您的代碼並添加每個導入工作的元素派對。也許你可以檢查那些？