angularjsangularsingle-page-applicationsymfonysinglepage

Single App with Symfony 3 and Angular 2 (Routes)


Currently I have an application built with Angular 2 (all the front-end side) and Symfony 3 (web framework) . I have defined each view as an Angular application.

I think it's the time to migrate to a Single App but I have some questions before I venture into the lion's den.

If a user change manually the URL, of course, they, should enter to the requested URL, but how can angular know which url is trying to open?

I should create multiple controllers or only one that catch all the requests? If none of above are the right way, please, can you suggest any way to do it?

Thank you so much.


Solution

  • If you're trying to build a Single Page application, it means that your routes will be managed by your front-end, here by Angular 2 via @angular/router.

    Symfony can then be only used as a back-end web service (i.e. a Restful API) that will answer to your front-end calls via JSON responses. Depending on the size of your API, you may wish to use FOSRestBundle for that purpose.

    So you don't have to worry about Symfony routing interpretation since your urls will be managed by Angular router. Symfony routes will be called directly by your Angular application to get/post/put/delete/patch your back-end data.

    UPDATE

    To answer you comment, a user who directly enters a URL will simply see the page you linked to this url via Angular routing, there is (almost) no difference between front-end and back-end routing.

    If you want to dive deeply in how hash routing works in javascript, you can check this article.

    To see a real-life example of a SPA with full Angular routing, ga.me is a good start.