Make HtmlTemplate act more like $compile

lf94 commented 7 years ago

Right now it's HtmlTemplate(template, scope, options), but Angular does $compile(template)($scope)

$compile should maybe be provided with a factory function, that takes options so it can be configured still.

$compile = $compileProvider(options); // returns $compile function $compile(template)($scope); // does what HtmlTemplate does

lf94 commented 7 years ago

If anyone is interested in merging this code, feel free. This is much more angular-like.

index.js

const Express = require('express');
e = Express();
const AngularTemplate = require('angular-template');

const options = {
    prefix: 'ng'
};

$compileProvider = function(options) {
    return a => b => AngularTemplate(a, b, options);
};

$compile = $compileProvider(options);

const pages = {
    '/': {
        template: './templates/master.html',
        controller: function ($scope){

            $scope.content = "Test!";

            return $scope;
        }
    },
    '/home': {
        template: './templates/master.html',
        controller: function ($scope){

            $scope.title = ' | Home';
            $scope.content = "Home";

            return $scope;
        }
    }
};

for(let key in pages) {
    e.get(key, (req, res) => {
        const html = $compile(pages[key].template)(pages[key].controller({}));
        res.send(html);
    });
}

e.listen(3000);

master.html

<!doctype html>
<html>
  <head>
    <title>Game Boy®.Tech{{ title }}</title>
  </head>
  <body>
    <header ng-include="'header.html'"></header>
    <nav ng-include="'nav.html'"></nav>
    <section>{{ content }}</section>
    <footer ng-include="'footer.html'"></footer>
  </body>
</html>

FDIM commented 7 years ago

It does make sense to me, 2 step flow aligns with what happens internally. Step 2 is simply jsTemplate function call and step 1 would be reusable. This is kind of the same as jsMode, but without modifying data. This would also most likely be a breaking change, unless we can trust that single param would trigger new flow (I guess we can). What do you think @allenhwkim ?

In the meantime @lf94, since you are using this together with express, be sure to set cache option. If you do not do this, each rendering call will load templates from disk.

allenhwkim commented 7 years ago

@FDIM I forgot what I did. I am so old :(. It's all yours now, thus, feel free to make changes as long as you are satisfied with. Unless I dive back to this again, it will take some time to have my memory back.

FDIM commented 7 years ago

Got it @allenhwkim, thanks for response.

lf94 commented 7 years ago

@FDIM I'll be sure to turn on caching :)

allenhwkim / angular-template

Make HtmlTemplate act more like $compile #6