2016-03-24 13 views
0

Ich versuche, eine kleine Web-Anwendung mit Polymer, basierend auf dem Polymer Starter Kit 1.3 zu bauen, und ich habe sofort auf ein Problem gestoßen - ich versuche, ein Element zu erstellen Das enthält ein Dropdown-Menü. Ich habe das Beispiel von the documentation kopiert/eingefügt, sondern von unten wie ein Tropfen suchen, es sieht aus wie ein normales nicht kollabiert listbox:Polymers Papier-Dropdown-Menü zeigt nicht kollabiert

enter image description here

Das ist mein Element Vorlage:

<template> 
    <style> 
     :host { 
     display: block; 
     } 

     span { 
     @apply(--paper-font-body1); 
     } 
    </style> 
<paper-dropdown-menu label="Dinosaurs"> 
    <paper-listbox class="dropdown-content" selected="1"> 
    <paper-item>allosaurus</paper-item> 
    <paper-item>brontosaurus</paper-item> 
    <paper-item>carcharodontosaurus</paper-item> 
    <paper-item>diplodocus</paper-item> 
    </paper-listbox> 
</paper-dropdown-menu>  
</template> 

Diese Ich bin das erste Mal mit Polymer (oder irgendeinem "fortgeschrittenen" Website-Kit - ich bin eher ein Old-School-HTML- und Javascript-Typ von Typ) und ich konnte nicht herausfinden, was ich falsch mache oder wie um dies zu debuggen.

Die app.js in PSK 1.3 scheint auf eine bottomContainer zu verweisen, die tatsächlich nicht in der Hauptdatei vorhanden sind, und dass viele Warnungen in der Konsole erzeugt, aber nachdem ich bemerkte aus jeder erwähnt des Behälters, um die Konsole Log sieht jetzt sauber aus - aber das Drop-Down wird immer noch nicht korrekt dargestellt.

Jede Hilfe wird geschätzt.

Antwort

1

Herausgefunden, was das Problem war - das paper-drowndown-menu.html Element wurde nicht von geladen. Ich habe es hinzugefügt und alles ist in Ordnung. Das Polymer Starter Kit ist ein bisschen schlecht, weil es in verschiedenen Aspekten nicht richtig funktioniert, und da der Neuling darauf ausgerichtet ist, sehe ich oft, dass ich in den Abgrund schaue und darüber nachdenke, ob ich springen soll oder nicht nicht ...

0

Sie müssen nur Papier-Drop-Down-menu.html und Papier-item.html

So etwas importieren:

<link rel="import" href="/bower_components/paper-dropdown-menu/paper-dropdown-menu.html"> 
 
<link rel="import" href="/bower_components/paper-item/paper-item.html">

Bitte stellen Sie sicher, dass der Pfad zu den Dateien basierend auf Ihrer Projektstruktur korrekt ist.

Verwandte Themen