2

I had this urge to use dust.js templates as it provides a much better performance for UI rendering by caching the templates.

But in my current project we are using angularjs. It is even possible/sensible to use dust.js or any other templating engine with angular js ??

Even if i use dust.js will I lose the 2-way binding .. ?

Please suggest considering a relatively large SPA.. ?

P.S. I am a novice in both angular and dust.

Karan Gujral
  • 389
  • 2
  • 4
  • 21
  • 1
    AngularJS too caches the templates it uses. I believe in something like `$templateCache`. – Chandermani Sep 17 '13 at 07:18
  • ya angularjs caches it in $templateCache but as per my understanding its just to prevent the fetching of templates from the server. Does angularjs also provide something like pre-compiled templates ? – Karan Gujral Sep 17 '13 at 07:38

1 Answers1

1

Sounds like a good use case for a filter!

Be aware that dust.js is an asynchronous renderer, but if you've already loaded everything then dust will fire synchronously (most of the time)

app.module('yours',[]).filter('dustRender', function(){
  return function(input, templateName){
    var rendered;
    dust.render(templateName, input, function(err, out){
      if('string' === typeof out){
        rendered = out;
      }
      err && console.error('Dust rendering error!', err);
    });
    return rendered || input;
  };
});

template

<span>{{ modelData | dustRender:'registered-dust-template' }}</span>

Note: Angular $sanitizes output, like html.

Community
  • 1
  • 1
PixnBits
  • 1,150
  • 10
  • 14
  • i dropped the idea of using the 2 together because I was losing the 2-way binding.. anyways +1 for the approach. U really gave me a nice insight into filters. Thanks – Karan Gujral Feb 06 '14 at 10:40