Angular.js and ASP.NET MVC 4

Que picture Que · Aug 13, 2013 · Viewed 42.9k times · Source

I have an ASP.NET MVC 4 project and I'm stuck on an architectural decision on which JavaScript framework or library to use Angular.js or Knock.js. I am currently leaning towards using Angular.js over Knockout.js, but don't want to find out midway during project development I made a mistake.

Here is some background:

  • We need two-way model data binding
  • We need the ability to test views. I want to be able to do end to end unit testing. Also, we are using continuous integration.
  • "Save Changes" functionality. i.e. if a user makes changes on a page we need the ability to detect any changes and prompt the user to save their changes before they navigate away from the page
  • "Notifications" functionality. i.e. user will be logged on approximately 8 hours and will need to be notified and updated of changes made by other users (errors, data status changes and the like)
  • We need to "future proof" our application. Currently the business unit hasn't decided if we will need to support mobile devices, but I know it's just a matter of time.
  • Our team consists of developers with varying experience levels from very junior to senior developers.
  • Currently our models are complicated and may get even more so
  • We need to also consider RAD, code reuse, and maintainability

I have read the excellent answer here and watched Scott Allen's interview about Angular here

Since we are unable to change from our current ASP.NET MVC 4 architecture to use something on the server side like Web API I have some concerns in trying to implement Angular.js with MVC 4. Will this cause us to have two models one on the server and one on the client?

I am not looking for a "which is better" discussion about Angular and Knockout because I think they both have their pros and cons. I am looking for actual code on implementing a JavaScript framework or library in an ASP.NET MVC 4 application. I need a solution that I can live with 2+ years from now :)

Any ideas or suggestions? Maybe the answer is not Knock or Angular, but some other JavaScript framework?

Answer

Anton picture Anton · Aug 13, 2013

my 2 cents worth.

preamble - i have worked with both angular and knockout. I'm on my 3rd non trivial front end built with a MVVM/MVC lib.

I started with knockout because its MVVM is very similar to the wpf/silverlight mechanics. And it works well. The tutorials and documentation are top notch. All your coders will be able to work with knockout.js within days or if they have used mvvm under .net, then within hours.

However, these days I am using angular and will probably stick with it for the following reasons.

  • angular is a complete framework - knockout is really about just the 2 way binding. you still need other libraries like backbone.js/jquery to do the rest of your work.

  • angular has dependency injection. which is perfect for adding
    mocking for testing as well as giving structure to your code.

  • angular treats normal JS variables as observables within its $scope object. that means you dont have to declare them in a special way

I'm not an angular fanboy, i still think they could move more over to the MVVM architecture instead of the "funky" MVVM/MVC hybrid architecture they currently have.

The biggest problem with angular is the documentation. Compared to knockout, it is woeful. It will add additional time and cost to getting your coders up to speed. Once they are there however, it is currently the best choice IMHO.