Contao und Angularjs

[tognit]

Hallo zusammen,

wie kann man Angularjs in Contao verwenden?

Mein Problem ist, dass man bei Angular für eine Ausgabe die gleiche Zeichenfolge wie beim Inserttag bracht {{ausgabe}}

Hat das schon jemand versucht oder sogar gelöst?

Besten Dank

Gruss
Steven

[xtra]

In Angular gibt es die $interpolateProvider api: http://docs.angularjs.org/api/ng.$interpolateProvider.

myModule.config(function($interpolateProvider) {
  $interpolateProvider.startSymbol('{[{');
  $interpolateProvider.endSymbol('}]}');
});

Damit hast du es in Angular auf "{[{ausgabe}]}" umgestellt.

Allgemein solltest du dir jedoch genau yberlegen warum und ob du die Contao Templates mit denen von Angular mixen moechtest. Eigentlich solltest du via Angular nur maschinenlesbare Daten abrufen, wie z.B. json oder xml und nichts was durch die Contao Templating Engine "laeuft". Das ist doch der ganze Sinn einer web app.

[fiedsch]

Allgemein solltest du dir jedoch genau yberlegen warum und ob du die Contao Templates mit denen von Angular mixen moechtest. Eigentlich solltest du via Angular nur maschinenlesbare Daten abrufen, wie z.B. json oder xml und nichts was durch die Contao Templating Engine "laeuft". Das ist doch der ganze Sinn einer web app.

Hilf mir doch bitte von dem Schlauch runter, auf dem ich gerade stehe: Wo, wenn nicht im Template eines
Conto-Moduls würde ich Angular Code einbauen?

Mein aktuelles Projekt: Conto Modul baut form aufgrund seiner Konfiguration und evtl. den Rechten des Users.
Beim form-submit werden Daten via AJAX nachgeladen. Die würde ich gerne mit Angular auf der Seite an
den richtigen Stellen einbauen. (Bsp.: eine Tabelle füllen).

Mit Deinem Tip $interpolateProvider funzt das zwar erst mal -- fühlt sich wie Du beschreibst aber nicht sauber an.

[tognit]

Hallo xtra,

danke für die Lösung! Funktioniert tiptop!

Hilf mir doch bitte von dem Schlauch runter, auf dem ich gerade stehe: Wo, wenn nicht im Template eines
Conto-Moduls würde ich Angular Code einbauen?

Das würde mich auch interessieren.

Gruss
Steven

[psren]

Naja, ich kann hier nicht von Angular+Contao reden, aber der Vorteil an JSON ist,
dass es klein ist und platzsparent in der Übertragung.
HTML an sich braucht keine Zeit um vom Server interpretiert zu werden.
Jage ich jetzt das HTML durch den Parser braucht es Zeit.

xtra meint glaube ich, dass man am Besten über einen JSON-Schnittestelle mit Angular direkt die Daten abholt, anstatt alles durchs Templating-System zu jagen,
Inserttags zu ersetzen etc...

[fiedsch]

xtra meint glaube ich, dass man am Besten über einen JSON-Schnittestelle mit Angular direkt die Daten abholt, anstatt alles durchs Templating-System zu jagen, Inserttags zu ersetzen etc...

So weit, so klar von meiner Seite. Aber -- das war das Problem im Originalpost -- Angular verwendet {{ und }} als Delimiter für die Ausgabe von Modellvariablen (ähnlich Twig). Wenn man also entsprechenden Angular-Code in einem Contao-Template stehen hat wird beim Rendern der Seite -- noch vor etwaigen AJAX-Calls, die JSON Daten liefern könnten -- das {{ foo }} von Conto als vermeintlicher Inserttag geparst und verschwindet damit.

Das lässt sich ja wie von xtra beschrieben fixen. Ich hatte mich dann an den Thread dran gehängt weil ich auf Erhellung zu "ob du die Contao Templates mit denen von Angular mixen möchtest." gehofft hatte.

Irgendwie muss das Angular Template ja ausgegeben werden um in den Browser kommen. Ich kann zwar alles in JS machen aber in einer typischen Angular Anwendung gibt es ja auch HTML Snippets und die kämen hier dann von Contao.