CODEWITHSUNDEEP
phpangularjssymfony
julio
julio

Reputation: 2937

Integrating AngularJS in Symfony APP

Here i was i have :

Now here is a sample of my routing file :

 $routeProvider.
  when('/liste-produits', {
    templateUrl: '../templates/list-products.html',
    controller: 'ProductListCtrl'
  }).
  otherwise({
    redirectTo: '/'
  });

The fact that i have to use "../". Because otherwise it won't work in dev environnement (app_dev.php). And of course by the time i will post it in production (app.php) i won't need to add this "../"

Do you guys understand my problem ?

Since i can get assetic from Symfony work in the routing file.

How can i solve this ?

Upvotes: 1

Views: 1142

Answers (2)

Marcel Burkhard
Marcel Burkhard

Reputation: 3523

There is an approach, where you define a global variable in your base twig file: Symfony 2:image paths in javascript file with assetic which you can in turn use in e.g. AngularJS.

There is also a bundle called FOSJsRoutingBundle, it sort of exposes your routes to the client and thus javascript. That might be interesting for you.

However there is another option; - I have personally used the approach posted by Rein Baarsma with the twig file and then cached the resulting javascript.

It's fairly simple to write a request listener that renders the twig file to a javascript file once a day or whenever the javascript file is deleted. I used the same approach with the stylesheets for a project with daily changing colors. If you do not cache it, the browser will revisit the route returning the javascript on each page and rerender the javascript file, which adds a lot of overhead.

Upvotes: 2

Rein Baarsma
Rein Baarsma

Reputation: 1536

You could simply make a Symfony Controller with a view on a js file. That way you can use the twig (or php) template functions (like twig's path() function) to avoid any strange urls.

In your controller:

public function routingAction(Request $request) {
     $this->render('angular/routing.twig.js');
}

And in your routing

$routeProvider.
  when('/liste-produits', {
    templateUrl: {{ path('product_list') }},
    controller: 'ProductListCtrl'
  }).
  otherwise({
    redirectTo: '/'
  });

Upvotes: 0

Related Questions