ASP.NET MVC and Angular JS tipping point

1
votes

I want to create a largish ASP.NET MVC Web application. On some pages I would like to utilise AngularJS.

This app will not be a SPA.

At what point does this become a problem? For example at what point does running effectively two MVC paradigms become a headache?

Or is it a case of as long as you have clear delineation between what's using ASP.NET MVC (standard action methods etc) and what's using Angular JS then the two run side by side ok without giving you massive code organisation/maintainability headaches?

Cheers for any wisdom.

I'd love John Papas opinion!

Andrew

2
asp.net-mvcangularjsasp.net-mvc-4
A good example of multi-page AngularJS is pluralsight.com – Markus Jarderot
@MarkusJarderot I'm really asking a different question eg using both at once as opposed to going all in on one or another. – Andrew Duffy
The pluralsight course AngularJS for .NET Developers has a chapter about mixing ASP.NET MVC and Angular. – Markus Jarderot

2 Answers

1
votes

Since you are only asking for opinions, I will be happy to share my experience. The two do mix very well, and I think in most cases (at least most of my own development) the .NET side becomes very light weight.

  • Your .NET Web API Controller becomes a simple call to the Data Layer to populate a model or List(Of T) models. This gets returned as JSON to the Angular service.
  • From there, Angular takes over all of the logic until you need to perform another CRUD operation. Manipulating, validating, etc. all happens client-side in either the model (for me the Angular service acts as the model in MVVM) or the angular controller (which is really a ViewModel).
  • It's best if you let your model (Angular service) handle as much business logic as possible and restrict the Angular controller to responding to clicks, input controls, etc.

To sum up, let your .NET server side be very light. Just transport data back and forth to the Data Layer. Let Angular do the heavy lifting. You definitely do not need to be building a SPA to see the wonderful benefits of a JS data binding library, of which Angular is arguably the best of breed.

An excellent blog post that contains [ details of what I've discussed here ].

Good luck!

1
votes

I use ASP.NET MVC alongside AngularJS for a fairly large in-house application. We don't really use many features of ASP.NET MVC beyond the basic page template and script bundling - so everything from the client-side is controlled by AngularJS and client-side routing - except for some distinctions we've made between 'modules' of the app where we wanted a different ng-app for each, along with different script dependencies.

If you're looking to take advantage of AngularJS on a page-by-page basis then I think you have no problem at all. As long as you reference the scripts (both core AngularJS scripts, and your AngularJS scripts for modules, controllers, etc.) correctly then you can just begin decorating elements with ng-app, ng-controller, etc. and it will just work. You could insert the relevant AngularJS scripts for relevant .cshtml pages using a @section declaration.

It will only be more complicated if you need a mix of server-side and client-side routing. Then it will be a case of carefully constructing ASP.NET MVC routes to deliver the SPA functionality where needed.