Doppelter Artikel bei der Suche
Sollte nur ein Element anzeigen
vaadin-combo-box
Element in die Seite ein <vaadin-combo-box #searchSport no-label-float
*ngIf="activitiesTypes"
placeholder="Activité"
[items]="activitiesTypes"
item-label-path="name"
item-value-path="$key"
[value]="activitiesTypeUid"
(selected-item-changed)="activitiesType=$event.detail.value">
</vaadin-combo-box>
mit
this.activitiesTypes = [
{
$key : 'tennis',
name: 'tennis'
},
{
$key : 'canoe',
name: 'canoe'
}
];
vaadin-combo-box
und suchen Sie nach einem Element.Es scheint nur in Chrome und Android Chrome zu sein. Ich habe auf Firefox, Safari getestet und es funktioniert.
Es funktionierte mit der Version v1.2.0 und der Fehler begann in v1.3.0
Hi!
Ich kann das Problem in einer reinen Polymer-App nicht reproduzieren, daher vermute ich, dass es etwas mit Angular zu tun hat. Siehe https://jsfiddle.net/Saulis/6kooy6d8/
Bekommst du irgendwelche Fehler in der Konsole?
Ihre jsfiddle funktioniert in meinem Browser.
Du hast also recht, es liegt an eckig. Haben Sie eine Vorlage mit Angular und Polymer für jsfiddle, um diesen Fehler zu reproduzieren?
Keine Fehler in der Konsole.
Ich habe einen Plunker mit Winkel und Polymer erstellt, aber es gibt keinen Fehler: https://plnkr.co/edit/pGqa0MXftgpMCSaAXCIO?p=preview
Ich werde weiter forschen, um die Ursache des Fehlers zu finden.
Ich erlebe dies auch mit Polymer 1.8.1 und Chrome. Scheint bei anderen Browsern kein Problem zu sein. Ich fange an zu glauben, dass es eine Race Condition in Chrome für größere Apps gibt, die dies verursacht. Um es noch einmal zu bestätigen, funktioniert gut mit vaadin-combo-box 1.2.0 & funktioniert nicht richtig in 1.3.3
@flyweight können Sie eine jsfiddle erstellen, bei der das Problem auftritt?
Ich versuche auch zu untersuchen, wo dies passieren könnte, erhalte aber die gleichen Ergebnisse wie bei
Nur um @Saulis zu beachten: Wenn ich Ihre Vorlage für den hier gezeigten Artikel verwende, sehe ich das Problem nicht. Es wird nur für mich angezeigt, wenn ich keine benutzerdefinierte Vorlage einfüge.
Ich habe das gleiche Problem wie @florent1933 und ich glaube, ich weiß, was das Problem ist. Ich verwende eine Polymer-CLI-Vorlage, die einige Polymer-Konfigurationsoptionen in der Datei index.html erstellt. Standardmäßig sieht es so aus:
window.Polymer = {
dom: 'shadow',
lazyRegister: true,
};
Die DOM-Eigenschaft ist standardmäßig auf 'shadow' gesetzt, aber wenn Sie sie auf 'shady' ändern, ist das Problem gelöst. Das Element dupliziert keine Elemente bei der Suche. Gibt es eine Möglichkeit, es mit 'shadow' zum Laufen zu bringen oder soll das Element nur mit 'shady' funktionieren?
Bestätigen Sie, was @Andres0101 oben angegeben hat, und ändern Sie diese Eigenschaft, um das Problem auch für mich zu
@Andres0101 : Gute Arbeit, um das Problem dieses Problems zu finden 👍
Es wäre toll, wenn Combobox mit Shadow Dom arbeiten kann, da ich Shady Dom nicht verwenden kann.
Danke für die Hilfe, hier ist ein Ausschnitt, um das Problem zu reproduzieren:
https://jsfiddle.net/Saulis/we90kg2t/
Ich weiß nicht, ob Sie es gesehen haben, aber wenn wir suchen, ist es nicht möglich, ein doppeltes Element mit dem Abwärtspfeil der Tastatur auszuwählen. Wollte diesen Punkt genau.
@LM450N : Du hast Recht! Erstaunliche Neuigkeiten!
Danke für @LM450N für das
Ich werde diese Ausgabe mit v2.0.0-alpha1
als geschlossen stempeln und empfehle, diese Ausgabe zu verwenden.
Für diejenigen, die 1.3.x
, habe ich den Fix für den Branch 1.x
– aber Vorsicht, es gibt einige grundlegende Änderungen in diesem Branch bezüglich der Verwendung von benutzerdefinierten Symbolen – sie verwenden slot
-Attribute statt Klassen.
Hilfreichster Kommentar
Danke für die Hilfe, hier ist ein Ausschnitt, um das Problem zu reproduzieren:
https://jsfiddle.net/Saulis/we90kg2t/