Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 13 down vote favorite
3

AngularJS uses two-way client side data binding (from AngularJS Developers guide): Two-Way Data Binding

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

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...

share|improve this question
 
I was using AngularJS inside Jade templates, which worked fine. Just make sure both template engines don't share some parts of syntax because you'll end up in escaping hell. I went with Knockout in the end, but both work well with Jade, because Jade doesn't use curly braces (if it would -> escaping hell). –  Prinzhorn Oct 27 '12 at 18:45
 
Good point! From AngularJS version 1.0, you can change interpolation markup easily. This might help in such situation. –  PrimosK Oct 27 '12 at 18:57
 
I didn't dive into AngularJS that much, but that's good to know. Knockout on the other doesn't have anything like that, just attributes (unless you use an external template engine). –  Prinzhorn Oct 27 '12 at 19:02
 
If you browse the AngularJS website you will find several AngularJS apps running on one page: angularjs.org. Depending on what you need exactly, I think it should work just fine! –  Flek Oct 27 '12 at 19:52
 
this question would be better off at programmers.stackexchange.com, it's not really the format for this site. –  blesh Oct 28 '12 at 20:06
show 1 more comments

1 Answer

up vote 5 down vote accepted

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.

share|improve this answer
3  
I think there's at least one benefit: you can render the page with initial data, useful for SEO. I've also wondering about that, but in fact, it seems there's no client-side template engine that supports this scenario. –  tanathos Dec 28 '12 at 3:03
 
It might be useful for SEO ... for now. But search engines are constantly evolving trying to get the best results to users. Your best bet in the long-run is to develop a site that delivers the content to the user in the best way possible, and let Google/Yahoo/Bing take care of their end. –  blesh Dec 28 '12 at 14:51
5  
In professional sites (such as e-commerce) there is often the requirement that the site has to work without javascript (even though the user-base nowadays does not have javascript disabled). So it's a necessary evil to preload the page with data. Another is slow page load that makes the site flicker from showing the template to compiled. So those are other reasons than SEO for why serverside preloading needs to be in place AFAIK. –  Spoike Feb 22 at 13:59
 
@Spoike: If it's a requirement that the site work without JavaScript, Angular is likely out the window anyhow. The only hope you'd have would be to use Node.JS and modify the Angular libraries to render the HTML at the server in cases where JavaScript wasn't working. But that would be the most awful hack of all time. Probably better off just using some server technology at that point. –  blesh Feb 22 at 19:50
 
I agree with @Spoike and tanathos. I don't like to get the index.html page and then make a request to get preload data. Is there a way to inject that data into Angular instead of making a new request? Usually, I use a server template engine, like Smarty, to render the first page and then a client template engine, like Angular, to change view through AJAX requests: however, I don't like this approach too because I'll get Smarty and Angular directives mixed together. I think that's the why that PrimosK made this post, right? –  Wilk Mar 25 at 18:47
show 2 more comments

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.