node package manager
Stop wasting time. Easily manage code sharing in your team. Create a free org »


Angular.js templates wrapper for SocketStream framework

ss-angular-templates - is a wrapper for angular.js templates, provides server-side compiled templates (html/jade) for SocketStream applications.

$ npm install ss-angular-templates --save


Let's say we have next templates structure:

            about.jade most cases we need to have an access within an angular.js application to the templates with templateUrl:

templateUrl: 'template/accordion/accordion.html', // in case if you are using
templateUrl: 'template/accordion/accordion-group.html',
templateUrl: 'pages/index.html', // Jade -> HTML convertation
templateUrl: 'pages/about.html',

But SocketStream's default angular.js template wrapper wraps templates with attribute id like this:

    <script id="tmpl-libs-template-accordion-accordion.html" type="text/ng-template">
    <script id="tmpl-libs-template-accordion-accordion-group.html" type="text/ng-template">
    <script id="tmpl-pages-index.html" type="text/ng-template">
    <script id="tmpl-pages-about.html" type="text/ng-template">

In addition, default angular.js templates wrapper doesn't support Jade tamplate engine files.


Since SocketStream is so awesome that provides the opportunity to write custom client wrappers you can use ss-angular-templates to be comfortable with Angular.js templates.

Include this line in your server-side app.js:

    ss.client.templateEngine.use(require('ss-angular-templates'), '', {idTransformer: customIdTransformer});

where idTransformer is a function for id template's attribute transformer:

    function customIdTransformer(template, path, id) {
        return 'custom-id-string';

You can also use this module for Jade tamplate engine files, here is a real live example:

     * Another Custom transformer function for angular Id templates
     * @param  {String} template Compile from Jade file HTML string
     * @param  {String} path     Jade templade file path
     * @param  {String} id       Default suggested 'id' by SocketStream
     * @return {String}          Transformed template with id for '<script type="text/ng-template" id="' + id + '.html">' + template + '</script>'
    function jadeTemplateTransformer(template, path, id) {
         *  Path
         *      'path-to-your-project/client/templates/pages/about.jade'
         *  will be transformed into
         *      'pages/about.html'
        return path.replace( pathlib.join(process.env.PWD, '/client/templates/'), '').replace('.jade', '.html');
// Use 'ss-angular-templates' wrapper for all the Jade file inside '/pageElements' (relevant to 'client/templates') with custom 'id' transformation function 'jadeTemplateTransformer()'
ss.client.templateEngine.use(require('ss-angular-templates'), '/pageElements', {jade: true, idTransformer: jadeTemplateTransformer});


  • idTransformer {Function} - id template's attribute transformer
  • jade {Boolean} - allows to compile Jade template engine files into HTML string