Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »

    ss-angular-templatespublic

    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

    Why

    Let's say we have next templates structure:

    client/
        templates/
            libs/
                template/
                    accordion/
                        accordion-group.html
                        accordion.html
            /pages
                index.jade
                about.jade

    ...in 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 http://angular-ui.github.io/bootstrap/
    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.

    Solution

    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});

    Options

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

    install

    npm i ss-angular-templates

    Downloadslast 7 days

    2

    version

    0.0.4

    license

    none

    repository

    github.com

    last publish

    collaborators

    • avatar