AngularJs and Laravel

Salut!

Am inceput azi sa combin Laravelul cu AngularJs,iese destul de fain, am vazut si ceva documentatie/tutoriale, dar inca nu mi-s clare niste chestii esentiale:

  • pentru fiecare pagina .blade.php trebuie sa fac un app nou ?
  • ca sa afisez o variabila din scope in view, normal se foloseste @{{ myVar }}, dar nu merge, trebuiesc oare ceva configuratii suplimentare ? in acest scop am folosit alte configuratii, dar nu e foarte comod sa folosesc {[ myVar ]}
.config(function($interpolateProvider) {
   $interpolateProvider.startSymbol('{[');
   $interpolateProvider.endSymbol(']}');
});

N-ar trebui. Ideea cu Angular e sa ai “single page application” deci fara refresh in browser. Angular va comunica cu Laravel doar RESTful. Laravel *.blade.php l-as folosi doar ca sa-mi incarce master layout cand se incarca prima oara pagina. De acolo preia “fraiele” Angular.

Din pacate Laravel si Angular folosesc sa afiseze in view “{{” “}}”. Poti sa schimbi delimitatoarele fie in Laravel fie in Angular cum ai facut deja. Alfel nu stiu cum… Practic folosind foarte putin Blade si foarte mult Angular as opta sa schimb in Laravel.

1 Like

Toata ideea unei SPA este sa faci tot ce tine de display pe client si sa-ti iei datele prin Ajax de pe server. Din acest motiv, nici nu prea ai nevoie de blade. Poti sa-l folosesti asa, de moft. Din comoditate.
Partea care-ti incarca aplicatia nici nu e musai sa fie php. Poate foarte bine sa fie un HTML chior in care iti incarci scripturile, iar scripturile genereaza tot restul. In felul asta, partea de client e complet independenta de partea de server, iar pe server, nu generezi elemente de DOM sa ai nevoie sa faci refresh. Trimiti doar JSON. In felul asta, nu ai batai de cap.
Aplicatiile care au in acelas fisier si cod php, si html, si javascript, poate si style de css, mie mi se par cele mai greu de mentinut.

Daca fac un singur ng-app = “app”, il pun in radacina <html ng-app=“app”…>, iar pentru fiecare pagina voi avea un nou controller, va trebuie in fiecare fisier (controllerX.js) sa includ secventa ?

angular.module('app', [])
    .controller('controllerX', controllerX)

daca am inteles eu bine ce intrebi, nu e okay.

practic o sa ai un modul angular continand toate controller-ele(controller scris in javascript):

angular.module('app', [])
    .controller('controllerX', controllerX)
    .controller('controllerY', controllerY)
    .controller('controllerZ', controllerZ)

din laravel o sa ai o singura ruta(routes) sau controller(method) care sa iti intoarca html-ul + js pentru prima pagina, de obicei pagina root("/"). restul rutelor/controller-elor ar trebui sa-ti intoarca doar json-uri. Laravel stie sa faca asta by default, which rocks.

dupa ce s-a incarcat prima pagina, preia(nu le preia automat, trebuie sa le codezi tu) angular toate actiunile pe care le-ai putea face in browser. Angular va face requesturi catre backend with $http, $resource(sort of ORM), cere templateuri html, etc.

uita-te pe link-ul asta(a fost dat aici pe forum, are si doua filmulete de prezentare) angular 50 examples

1 Like

Am privit exemplele din filmulete, sunt foarte utile, merci mult!

Deci sa continuu sa folosesc rutele din Laravel (routes.php), doar ca le voi accesa din controllerele Angular ? Sau sa folosesc (ca in tutorial) angular-route, adica:

app.config(function($routeProvider){
            $routeProvider.
                when('/' ,{
            
                    template: "<ul><li ng-repeat = 'name in names'>{{name.name}}</li></ul>",
                    controller: 'mainCtrl'
            }).

etc.
Nu stiu cum ar fi mai bine, si plus la asta ma gandesc ca ar fi conflicte intre rutele Laravel si cele de Angular.