I want to write a collection of Single Page Apps in .NET using MVC and Angular JS (1.x). I would like to manage the bootstrap of each SPA using MVC all within a single project so that the look and feel is consistent using the _Layout and Return view(); But I would like the data binding in the ng $scope to get and post via api calls. How do you mix MVC controllers and API controllers in the same project when they could logically have the same name. E.g. The MVC controller to bootstrap the Product SPA would be ProductController : Controller and the data calls would be in an API controller ProductController : apiController
The routes to these would be different: baseURL/products/... for the MVC and baseURL/api/products/... for the API calls. How does the router know which controller to call as they do not technically have to live inside the Controllers folder. Prefixing the API Controllers with api seems a bit of a cludge and creates ugly URLS - granted they should only ever be consumed by the javascript but if I want to make them available externally I would prefer them to be clean.
Have a look at here. I think it would be better to use a separate project for WebAPI and MVC.