2014-01-25 9 views
27

Ich habe Probleme, ist diese Ehe von 2 scheinbar leistungsfähige Frameworks. Es scheint, dass die meisten Dinge, die von 1 getan werden können, von 2 getan werden können. Wie kann man die beiden am besten nutzen? Gibt es Denkmuster? Nehmen Sie ein einfaches Beispiel für eine CRUD-Anwendung - Ich kann eine Route mysite/listnames schreiben, die auf einen Controller im Spiel zuordnet! und das macht eine Vorlage mit dem Code -Spiel kombinieren! Framework 2.xx mit Angular.js

Beachten Sie, dass Main eine typische Bootstrapping-Vorlage ist. Aber jetzt scheint die Ausgabe, die erzeugt wird, Angular nicht zu nutzen, wenn ich sage, dass ich ein Eingabefeld für das Filtern dieser Namen hinzufügen möchte, oder ich möchte irgendetwas mit ihnen überhaupt machen. Was ist eine typische Vorgehensweise? Die Basissache scheint zu sein

1), wie man Daten weitergibt, die ankommen, nachdem die Schablone durch Spiel zu eckigem für späteren Gebrauch am clientside gerendert wird.

2) Ist es überhaupt ratsam, diese beiden Frameworks zusammen für eine groß angelegte App mit einem mathematisch objektorientierten Backend + Server und einer ziemlich intensiven Benutzeroberfläche am Frontend zu verwenden?

+0

Denken Sie daran, Angular-Caches-Vorlagen standardmäßig, so dass dynamischer Wiedergabe Inhalt hat keinen Sinn. –

Antwort

45

Es gibt viele Möglichkeiten, wie Sie diese beiden Frameworks kombinieren können. Alles hängt davon ab, wie viel Sie jeden davon umwandeln möchten. Zum Beispiel kann Ihre Play 2 Anwendung nur JSON Anfrage/Respons von der einen Seite (Server Seite) und AngularJS würde alle anderen Sachen von der Client-Seite. In Anbetracht Ihrem Beispiel für grundlegende CRUD App:

  1. A Play 2-Controller:

    def getNames = Action { 
    
        val names = List("Bob","Mike","John") 
        Ok(Json.toJson(names)).as(JSON) 
    
    } 
    
  2. Ihre Play-Wurzel für sie:

    GET /getNames controllers.Application.getNames

  3. ein AngularJS Controller:

    app.controller('NamesCtrl', function($scope) { 
        // get names using AngularJS AJAX API 
        $http.get('/getNames').success(function(data){ 
         $scope.names = data; 
        }); 
    }); 
    
  4. Unsere HTML:

    <!doctype html> 
    <html ng-app> 
    <head> 
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular.min.js"> </script> 
    </head> 
    <body> 
        <div> 
         <ul> 
          <li ng-repeat=" name in names">{{name}}</li> 
         </ul> 
        </div> 
    </body> 
    </html> 
    

Auf diese Weise kann die Bedenken vollständig zu trennen, für die Client-Seite, spielt es keine Rolle, wie die Server-Seite implementiert ist, was Sie brauchen nur gültig JSON als eine Antwort. Es wird als eine gute Übung angesehen.

Aber natürlich können Sie die meisten Ihrer HTML von Play 2 Rendern und AngularJS für einige spezifische Sachen, wo erforderlich. Alles hängt davon ab, welche Konzeption Sie für Ihre App wählen.

... wie Daten weitergegeben werden, die nach dem Rendern der Vorlage von ankommen Spielen Sie zu eckigen für die spätere Verwendung auf Clientside?

Ich glaube nicht, dass es eine gute Idee ist, aber Sie können sicher tun es ngInit Richtlinie wie folgt aus:

@(message:String) 
@main("Welcome") { 
<div ng-init="angular_message = @message"> 
<h1>Hello, {{angular_message}} !</h1> 
</div> 

} 

und Sie werden angular_message haben in der mit @message Wert initialisiert scope von Play 2 Vorlage.

Ist es überhaupt ratsam, diese beiden Frameworks zusammen für eine groß Ebene App zu verwenden, um ein mathematisches Objekt orientierte Backend + -Server und eine ziemlich intensive UI am Frontend beteiligt?

Aus meiner Sicht, ja, es sind zwei großartige Rahmen und sie arbeiten perfekt im Konzert.

+0

Könnten Sie bitte erläutern, warum Sie die Verwendung von 'ngInit' nicht für eine gute Idee halten? Danke – ishaaq

+0

Ja, auch neugierig auf deine Gedanken, warum 'ngInit' weniger bevorzugt ist – jetcom

+2

Siehe auch https://typesafe.com/activator/template/angular-seed-play (Vielleicht hast du schon angefangen) aber für andere, die stolpere über diesen Thread. –