Was ist die empfohlene Methode zum Strukturieren einer benutzerdefinierten Joomla 3-Komponentenansicht mit angleJS?


7

Es gibt nur sehr wenige Informationen von Benutzern, die eckige js erfolgreich in eine Listenansicht für benutzerdefinierte Joomla-Komponenten integriert haben. Ich habe folgendes gefunden:

/programming/23365907/how-to-integrate-angularjs-app-inside-joomla und http://jeviathon.com/2014/06/02/joomla3/

und ich habe die Dokumente auf der Joomla Ajax-Oberfläche gelesen - https://docs.joomla.org/Using_Joomla_Ajax_Interface - was hilfreich aussieht.

Mein spezifisches Projekt ist groß j! 3.4 Site mit einer Reihe von benutzerdefinierten Komponenten, die in component-creator.com mit jeweils einer Formular-, Element- und Listenansicht gestartet wurden. Mein ursprüngliches Ziel ist es, Winkel in einigen angepassten Listenansichten für eine schnelle Suche und Filterung von UX zu nutzen.

Was sind die empfohlenen Praktiken der Experten? Hat jemand das getan? Was sind die Schritte / Fallstricke.

Vielen Dank

Antworten:


7

Nach meiner Erfahrung:

  • JSON-Ansichten : Ich habe komponentenbasiertes FoF-automatisches JSON-Rendering erstellt. Https://github.com/akeeba/fof Auf diese Weise ist es einfach, Abfragen zu laden / abzurufen. Trotzdem können bestimmte Aufgaben einfach mit einer einfachen Controller-Funktion gelöst werden. Mit FoF können Sie im perfekten Fall eine URL aufrufen (index.php? Option = com_todo & view = task & format = json) und die JSON-Ausgabe ohne zusätzlichen Code abrufen. In der Praxis müssen Sie möglicherweise eine view / tmpl / task_json.php definieren, um eine Zeitzone zu übersetzen oder Zeichen für AngularJS zu codieren.

  • Informationen zur Joomla Ajax-Benutzeroberfläche : Es ist eine verlockende Funktion. Sie können einfach ein Plugin oder Modul erstellen, um Ajax-Abfragen zu integrieren. Es ist die Technologie für ein Modul Ajax-Integration. Für die Komponentenentwicklung entscheide ich mich jedoch für eine bessere Kontrolle über die JSON-Generierung auf Komponentenebene.

  • Modulmanager : AngularJS hat eine eigene Definition von Modulen. Die meisten AngularJS-Apps sind in Apps, Controllern und Diensten organisiert. Auf der anderen Seite bietet Joomla eine einfache Möglichkeit, einer Seite Javascript hinzuzufügen (addScript oder addScriptDeclaration). In jeder soliden Projektorganisation ist eine Entwicklungs-Toolbox geplant, mit der alle AngularJS-Dateien zu minimierten Dateien kompiliert werden können.
  • Joomla MVC <-> AngularJS MV * Es gibt keine direkte Übersetzung zwischen beiden Frameworks. Dann ist Joomla View nur eine Leinwand, auf der AngularJS-Ansichten leben. AngularJS-Dienste können mit Joomla-Modellen / -Tabellen übereinstimmen.
  • Sicherheit und Authentifizierung AngularJS muss den Richtlinien des Joomla-Frameworks entsprechen. Namenly, Token in $ resource- und $ http-Abfragen. Alle Aktionen müssen ACL-geprüft sein.

Könnten Sie mir dies bitte erklären: "Ich habe komponentenbasiertes FoF-automatisches JSON-Rendering erstellt. Github.com/akeeba/fof Auf diese Weise ist es einfach, Abfragen zu laden / abzurufen."
user2097091

Mit FoF können Sie im perfekten Fall eine URL aufrufen (index.php? Option = com_todo & view = task & format = json) und die JSON-Ausgabe ohne zusätzlichen Code abrufen. In der Praxis müssen Sie möglicherweise eine view / tmpl / task_json.php definieren, um eine Zeitzone zu übersetzen oder Zeichen für AngularJS zu codieren.
Anibal

Kennen Sie Beispielkomponenten?
user2097091

Wir haben es für soziale Komponist von AutoTweetNG umgesetzt und Joocial extly.com/autotweet-ng-pro.html ;-)
Anibal

Wären Sie für die Community daran interessiert, Ihre Antwort um einige konkrete Beispiele / Schritte zu erweitern?
user2097091

1

Ich habe gerade 3 Angular-Apps gegen Joomla.

Die Grundidee besteht darin, die Ressource einzurichten und sie mit den Anforderungsfeldern Option / Format / Controller bearbeiten zu lassen. Rufen Sie dann im Controller Ihr Modell auf, um die Berechnung durchzuführen, und hängen Sie dann davon ab, wo Sie das Ergebnis im Modell gespeichert haben.

$ response = new stdClass (); $ response-> data = $ model-> data;

echo json_encode ($ response);

super sauber, super einfach.

In meinem Fall gibt es für jede App eine einzelne Joomla-Ansicht. Die Datei tmpl / default.php ist im Grunde nur ein Include zum Haupt-HTML.

Ich verwende ngBoilerplate als Basis für meine Builds, daher musste ich die index.html ändern, um die Skripte zu finden, die grunt einfügte.

Die App selbst befindet sich in / media / com_extension / lib / app / build. Ich habe es in Build belassen, weil es nichts bewirkt, und jetzt kann ich es einfach bearbeiten und aus dem Ordner erstellen, in dem die App bereitgestellt werden soll.

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.