Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

Background

I am currently building a website that uses NodeJS for the server, Express Handlebars(Just Handlebars but server side) , and hopefully AngularJS for some client side stuff.


The Problem

AngularJS and Handlebars use the same syntax for templating
{{foo}}
This causes a problem where AngularJS code will be interpreted by Express Handlebars first, which will then throw an error because the data it is trying to pull only exists in Angular not Node.


The Question

Is there a way to get AngularJS and Express Handlebars to work together?


Possible Solutions

  • Change the syntax of AngularJS
    • I was looking at BackboneJS and it looks like it is possible to change the syntax. There could possibly be something similar is AngularJS.
  • Create a ng helper in Express Handlebars.
    • It would just return its un-parsed content. However I couldn't figure out how to do this.
share|improve this question
    
Why are you using handlebars on the server side rather than jade or ejs? Handlebars/Angular are best on the client side. –  jwimmer Aug 18 at 15:09
    
@jwimmer what makes Handlebars better client-side? unless something outrageous, it doesn't mean one shouldn't use handlebars server-side –  jberger Nov 10 at 20:19

2 Answers 2

up vote 5 down vote accepted

Your first solution is possible, AngularJS allow to change the start/end symbols of text interpolation like this:

appModule.config(function($interpolateProvider) {
  $interpolateProvider.startSymbol('{[{');
  $interpolateProvider.endSymbol('}]}');
});

Then you could use it in your template:

<div>{[{message}]}</div>

Also see: $interpolateProvider documentation

Hope this helps.

share|improve this answer

I would recommend using the AngularJS's data-binding syntax (what looks similar to Handlebars) and have your NodeJS server simply serve the static AngularJS source code. I prefer to offload the templating onto the client and therefore put less stress on your server, not to mention that AngularJS and other MVC frameworks (my favourite is EmberJS) are great for dynamically building the webpage.

I am a fan of Yeoman and here is a generator for building an Angular project served by NodeJS: https://github.com/yeoman/generator-angular

share|improve this answer
    
I agree that MV* frameworks are great for dynamically building a webpage, but I think page-instance-specific parts should be served compiled. anything that could change via user interaction -> use client-side templating. –  jberger Nov 10 at 20:23

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.