Bootstrap modal erscheint nicht in Meteor

8

Ich versuche, das Modal von Bootsrap zu funktionieren, aber wenn ich auf den Knopf klicke, bekomme ich nur einen schwarzen Bildschirm, es erscheint kein modales Dialogfeld, wie ich es erwarte. Ich benutze Meteor.

Hier ist der Code, den ich habe:

%Vor%

Ich habe im Wesentlichen den Code erhalten von: Ссылка zu Testzwecken.

>     
kpatelio 02.03.2013, 15:58
quelle

4 Antworten

8

Ich hatte ein ähnliches Problem. Das Problem ist ein grundlegender Unterschied in der Funktionsweise von Meteor und Bootstrap. Meteor geht davon aus, dass das Markup jederzeit neu geladen werden kann. Wenn sich Live-Variablen ändern, lädt Meteor die Vorlage einfach neu. Bootstrap setzt dagegen voraus, dass die Vorlage nur einmal geladen und zur Laufzeit mit JavaScript verändert wird.

Was passiert, ist, dass der Meteor meine modale Vorlage lädt. Irgendwann klicke ich auf etwas, was bewirkt, dass Modal in Javascript erscheint. Einen Sekundenbruchteil später ändert sich jedoch eine Live-Variable, wodurch die Vorlage erneut geladen wird. Da die Vorlage das Modal ausgeblendet hat, überschreibt es das Javascript, das gerade versucht hat, die Vorlage anzuzeigen.

Ich löste das, indem ich das Innere des Modals in eine andere Vorlage als das Äußere legte. Die äußere Vorlage reagiert auf keine Live-Variablen, daher wird sie hoffentlich nie neu geladen.

Vorher:

%Vor%

Nachher: ​​

%Vor%     
vish 02.06.2013 05:27
quelle
4

Hier ist eine Beispiel-App, die zeigt, wie man ein Bootstrap-Modal mit Meteor anzeigt:

Sie können hier eine Live-Version in Aktion sehen:

alanning 17.12.2013 23:58
quelle
2

Ich habe eine anständige Lösung gefunden - mein Modal ist eine eigene Vorlage und eine Sitzungsvariable steuert, ob sie angezeigt wird. Nachdem es "gerendert" wurde, starte ich den JS von Bootstrap, um es zu "öffnen".

%Vor%

Der knifflige Teil war das Verknüpfen von Ereignissen zwischen Meteor und Bootstrap.

  • Auf Meteor rendern - & gt; triggert Bootstrap Modal show
  • Bootstrap Modal verstecken - & gt; Session-Variable von Meteor löschen

Das funktioniert wirklich sehr gut, hier ist eine vereinfachte Version von dem, was ich gemacht habe ...

%Vor%

Dann ist das Auslösen des Modals so einfach wie das Setzen der Sitzungsvariablen auf "wahr" ... der gesamte übrige Austausch basiert auf Ereignissen.

    
zeroasterisk 20.08.2013 03:57
quelle
0

Ich hatte das gleiche Problem. Ich habe die Klasse 'Verstecken' aus dem Modal entfernt und danach funktioniert es. Ich musste auch das Modal in die gleiche Vorlage mit dem Link aufnehmen, der es aktiviert.

Anstelle von

%Vor%

Versuchen Sie es

%Vor%     
user1000952 04.05.2013 20:09
quelle