AngularStrap Tabs laden HTML-Fragment

8

Ich arbeite gerade an einem AngularJS-Projekt mit Twitter Bootstrap und versuche, meine Bootstrap-Anweisungen in Angular zu verschieben. Ich entschied mich für AngularStrap, da es die Unterstützung für Bootstrap-Select bot (was für AngularUI nicht der Fall war). Das Beispiel Tabs behandelte nur statisches HTML. Gibt es eine Möglichkeit via AngularStrap oder AngularJS HTML-Fragmente dynamisch zu laden, so dass es nur beim Anklicken der Registerkarte aufgerufen wird? Meine HTML-Fragmente müssen auch JavaScript ausführen.

Mein Grund dafür ist zweifach. Erstens enthält jede Registerkarte ziemlich viel Inhalt, und ich möchte nicht alle Registerkarten gleichzeitig laden, was das Laden verlangsamt. Der zweite Grund ist, dass ich einen eher modularen Ansatz für meinen Quellcode bevorzuge und nicht alles auf dieselbe HTML-Datei lege.

    
Wei Hao 28.05.2013, 01:42
quelle

1 Antwort

10

Sie können die ng-include -Direktive zum Laden von HTML-Fragmenten verwenden.

Wenn Sie das Beispiel der AngularStrap-Registerkarte verwenden, können Sie den statischen Inhalt mit der URL abschalten, um das HTML-Fragment abzurufen. Hier ist ein Beispiel , das auf dem Beispiel der Registerkarte AngularStrap mit folgenden wichtigen Änderungen basiert:

1) $scope.tabs hat jetzt eine page -Eigenschaft anstelle des Inhalts, der auf template1.html, template2.html oder template3.html verweist.

%Vor%

2) Ein ng-include wird hinzugefügt, um die aktuell ausgewählte Registerkarte anzuzeigen.

%Vor%

Hinweis: Ich habe die ng-include außerhalb der ng-repeat , so dass der Seiteninhalt der einzelnen Registerkarten nicht geladen wird (auch wenn sie nicht angezeigt werden).

    
Gloopy 04.06.2013, 05:00
quelle

Tags und Links