MoLow / ng-node-compile

Compile html templates the angular way, in node js
14 stars 7 forks source link

ng-node-compile

Build Status Coverage Status npm dependencies

Compile html templates the angular way, in node js! this is a pretty new package, so don't hesitate adding issues or pull requests!

Note that as of our 2.0.0 release, nc-node-compile no longer works with Node.js™, and instead requires io.js. You are still welcome to install a release in the 1.x series if you use Node.js™.

new ngcompile().$interpolate("hello {{name}}")({ name: 'Jhon doe' });

Install

$ npm install ng-node-compile

How to Use?

The library exposes several angular services, which will let you compile angular templates inside node:

ngcompile

this is the function to create a angular enviorment. just

var ngEnviorment = new ngcompile([modules],[angularPath],[settings]);

arguments:

$interpolate:

var ngcompile = require('ng-node-compile');
var ngEnviorment = new ngcompile();
ngEnviorment.$interpolate("hello {{name}}")({ name: 'Jhon doe' });

this wil return a string "hello Jhon doe"

$compile:

var ngcompile = require('ng-node-compile');
var ngEnviorment = new ngcompile();
ngEnviorment.$compile("<div ng-repeat=\"n in [1,2,3,4,5]\">hello {{name}} {{n}}</div>")({ name: 'Jhon doe' });

using settings

var ngcompile = require('ng-node-compile');
var ngEnviorment = new ngcompile({ startSymbol: '[[', endSymbol: ']]' });
ngEnviorment.$compile("<div class=\"[[name]]\">hello {{name}}</div>")({ name: 'active' });

can also be called with angular modules and angular path arguments:

var ngEnviorment = new ngcompile([{ name: 'test', path: './test.js' }], './angular.js', { startSymbol: '[[', endSymbol: ']]' });

async issues usualy ng-node-compile is required in head Of page, and then used only some time after that, So it could be used totaly synchronously. if You want to use is Asynchronously, use the env promise, and the onReady promise: you could use the onReady function:

var ngcompile = require('ng-node-compile');
ngcompile.prototype.env.then(function(){
    var ngEnviorment = new ngcompile();
    ngEnviorment.onReady.then(function(){
        ngEnviorment.$interpolate("hello {{name}}")({ name: 'Jhon doe' });
    });
});

example using express and extra angular moduls:

app.js:

var express = require('express'),
    ngcompile = require('ng-node-compile');

var ngEnviorment = new ngcompile([{ name: 'test', path: './test.js' }]);
var app = express();

app.get('/', function (req, res) {
    res.send(ngEnviorment.$compile("<div ng-repeat=\"n in [1,2,3,4,5]\" yellow=\"{{n==3}}\">hello {{name}} {{n}}</div>")({ name: 'Jhon doe' }));
});

var server = app.listen(3000);

test.js:

angular.module('test', [])
.directive('yellow', [function () {
    return {
        restrict: "A",
        replace: false,
        scope: false,
        link: function (scope, element, attr) {
            if (attr['yellow'].toString() === "true") element.css('color', 'yellow')
        }
    }
}])

and the restlt simply looks this way:

result

<div ng-repeat="n in [1,2,3,4,5]" yellow="false" class="ng-binding ng-scope">hello Jhon doe 1</div>
<div ng-repeat="n in [1,2,3,4,5]" yellow="false" class="ng-binding ng-scope">hello Jhon doe 2</div>
<div ng-repeat="n in [1,2,3,4,5]" yellow="true" class="ng-binding ng-scope" style="color: yellow;">hello Jhon doe 3</div>
<div ng-repeat="n in [1,2,3,4,5]" yellow="false" class="ng-binding ng-scope">hello Jhon doe 4</div>
<div ng-repeat="n in [1,2,3,4,5]" yellow="false" class="ng-binding ng-scope">hello Jhon doe 5</div>