AngularJS client side data binding and server side templating

Question

AngularJS uses two-way client side data binding (from AngularJS Developers guide):

Has anyone consider using mix of server side templating engine with AngularJS two-way client side data binding. Something like this:

I am thinking about using AngularJS just for parts(components) of the page? Would it be good idea?

I would like to hear if you already had experiences with similar approach and what were drawbacks and advantages...

Answer 1

Angular is a complete UI rendering client framework. You can feed data into it, and it will render the proper html. On it's own Angular is a templating solution completely de-coupled from any server.

What you're attempting to do, is re-couple your Angular application to your server. It will be more work, there will be very few benefits, and you'll lose your ability to switch server technologies but keep your angular application untouched.

In essence, you don't want to do this for the same reason you wouldn't want to have your server rendering JavaScript for you... it's just less obvious because of all of the years we've been rendering all of our HTML at the server.

The end result is what's important. That the UI works properly and the application is easy to maintain. If you find your solution to be easier to maintain, then you should do it. I have a hard time imagining much being easier to maintain than straight HTML and JavaScript with a server that does nothing but host JSON.