I have Symfony2 for REST api and AngularJS on the front-end. Can't figure out how to deal with the routing. I have the following setup, that doesn't work:
In the Symfony2 controller:
/**
* @Route("/", name="index")
* @Route("/post/{slug}", name="post")
* @Template()
*/
public function indexAction()
{
// index.html.twig is a plain html file with inclusion of all the scripts
return $this->render('AcmeAppBundle::index.html.twig');
}
Angular setup:
angular.module('acmeApp', [])
.config(['$routeProvider',
function($routeProvider) {
$routeProvider
.when('/', {
templateUrl: '/assets/partials/index.html',
controller: "MainCtrl"
})
.when('/post/:slug', {
templateUrl: '/assets/partials/post.html',
controller: "PostCtrl"
})
.otherwise({
redirectTo: '/'
});
}
])
.config(['$locationProvider',
function($locationProvider) {
$locationProvider.html5Mode(true).hashPrefix('!');
}
])
When I open acme.com/ and follow a link to acme.com/post/123, this works fine, Angular picks up the route. But when I start from acme.com/post/123, Symfony2 redirect to acme.com/postand I'm not getting to the post page.
Any recommendation how you setup routing in Symfony2 to use with Angular JS?
Update:
Adding <base href="/"> to index.html.twig seems to fix the problem.
Symfonyare not the same as routes inAngularJS. E.g.http://example.org/post/123#!/would be/post/123on Symfony but/on Angular. – David Riccitelli Nov 22 '13 at 16:31/post/123is returning a JSON representation of a post with id 123, and/postan array of posts, you can create an Angular app that uses$resourceto load the list of posts and post detail, see here for more details: docs.angularjs.org/api/ngResource.$resource – David Riccitelli Nov 22 '13 at 16:40/post/123and Angular interpret it as/? – Websirnik Nov 22 '13 at 16:42