marcoslin · August 29, 2015 14:01
diff --git a/app.js b/app.js
 var app = angular.module("webapp", []);

 /**
 * MustacheTemplater is a simple and small templating designed to
 * generate simple text containing mustache quoated params. The template
 * is defined using <script> tag with type of "text/ng-template".
 *
 * It is intentionally kept simple supporting only key value pares.  Need
 * additional logic?  Use the mustache library instead.
 * 
 * Sample usage include error message or SQL generation.
 */
 app.service("MustacheTemplater", function ($templateCache, $log) {
    var self = this;

    /**
     * render: Render the text containing mustache parameters.  If key mot provided in
     * `params`, it will be replaced by an empty string.
     *
     * @param {string} template_text - Text with mustache variable to be parsed
     * @param {Object} [params] - Optional key/value that will be used to populate template.                  
     */
    this.render = function (template_text, params) {
        // Default params to an empty object
        params = params || {};
        
        // Search for mustache like params with {{...}}
        return template_text.replace(/{{\s*[\w\.]+\s*}}/g, function(x) {
            // Extract key in the mustache quote 
            var key = x.match(/[\w\.]+/)[0];
            
            // Return the key from params if exists, or return an empty string
            if (typeof params[key] === "undefined") {
                return "";
            } else {
                return params[key];
            }
        });
    }
    
    /*
     * generate: retrieve the template using `template_id` and render the result
     *
     * @param {string} template_id - Text of `id` to retrieve the ngTemplate
     * @param {Object} [params] - Optional key/value that will be used to populate template.
     */
    this.generate = function (template_id, params) {
        // Retrieve 
        var templ = $templateCache.get(template_id);
        return self.render(templ, params);
    }
    
    /*
     * generate_trimmed: Same as `generate` but remove all extra spaces.  Designed to remove
     * space based formatting of a SQL statement to be passed as URL.
     *
     * @param {string} template_id - Text of `id` to retrieve the ngTemplate
     * @param {Object} [params] - Optional key/value that will be used to populate template.
     */
    this.generate_trimmed = function (template_id, params) {
        // Retrieve 
        var templ = $templateCache.get(template_id).trim(),
            // Replace continue white space to a single space
            templ_trimmed = templ.replace(/\s+/g, " ");
            
        return self.render(templ_trimmed, params);
    }
    
    

 });


 app.controller("TestController", function ($scope, MustacheTemplater, $log) {
    
    $scope.title = "The Value";
    
    var sql = MustacheTemplater.generate("select_data", $scope);
    $log.log("sql: ", sql);
    
    var sql_trimmed = MustacheTemplater.generate_trimmed("select_data", $scope);
    $log.log("sql:" + sql_trimmed);
    
    $scope.template = sql;
        

 });
diff --git a/index.html b/index.html
 <html>
    <head>
        <title>Angular Template Test</title>
    </head>
    
    <body ng-app="webapp">
        <h1>Angular Template Test</h1>
        
        <div ng-controller="TestController">
            <div>Title: {{title}}</div>
            <div>Sql: {{template}}</div>
        </div>
        
        <div id="sql"></div>
        
        <script id="select_data" type="text/ng-template">
            select *
            from main_table
            where key = "{{title}}"
            and value = "{{title}}"
            order by {{order_by}}
        </script>
        
        <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
        <script src="app.js"></script>
    </body>

 </html>
	var app = angular.module("webapp", []);

	/**
	* MustacheTemplater is a simple and small templating designed to
	* generate simple text containing mustache quoated params. The template
	* is defined using <script> tag with type of "text/ng-template".
	*
	* It is intentionally kept simple supporting only key value pares. Need
	* additional logic? Use the mustache library instead.
	*
	* Sample usage include error message or SQL generation.
	*/
	app.service("MustacheTemplater", function ($templateCache, $log) {
	var self = this;

	/**
	* render: Render the text containing mustache parameters. If key mot provided in
	* `params`, it will be replaced by an empty string.
	*
	* @param {string} template_text - Text with mustache variable to be parsed
	* @param {Object} [params] - Optional key/value that will be used to populate template.
	*/
	this.render = function (template_text, params) {
	// Default params to an empty object
	params = params \|\| {};

	// Search for mustache like params with {{...}}
	return template_text.replace(/{{\s[\w\.]+\s}}/g, function(x) {
	// Extract key in the mustache quote
	var key = x.match(/[\w\.]+/)[0];

	// Return the key from params if exists, or return an empty string
	if (typeof params[key] === "undefined") {
	return "";
	} else {
	return params[key];
	}
	});
	}

	/*
	* generate: retrieve the template using `template_id` and render the result
	*
	* @param {string} template_id - Text of `id` to retrieve the ngTemplate
	* @param {Object} [params] - Optional key/value that will be used to populate template.
	*/
	this.generate = function (template_id, params) {
	// Retrieve
	var templ = $templateCache.get(template_id);
	return self.render(templ, params);
	}

	/*
	* generate_trimmed: Same as `generate` but remove all extra spaces. Designed to remove
	* space based formatting of a SQL statement to be passed as URL.
	*
	* @param {string} template_id - Text of `id` to retrieve the ngTemplate
	* @param {Object} [params] - Optional key/value that will be used to populate template.
	*/
	this.generate_trimmed = function (template_id, params) {
	// Retrieve
	var templ = $templateCache.get(template_id).trim(),
	// Replace continue white space to a single space
	templ_trimmed = templ.replace(/\s+/g, " ");

	return self.render(templ_trimmed, params);
	}



	});


	app.controller("TestController", function ($scope, MustacheTemplater, $log) {

	$scope.title = "The Value";

	var sql = MustacheTemplater.generate("select_data", $scope);
	$log.log("sql: ", sql);

	var sql_trimmed = MustacheTemplater.generate_trimmed("select_data", $scope);
	$log.log("sql:" + sql_trimmed);

	$scope.template = sql;


	});
	<html>
	<head>
	<title>Angular Template Test</title>
	</head>

	<body ng-app="webapp">
	<h1>Angular Template Test</h1>

	<div ng-controller="TestController">
	<div>Title: {{title}}</div>
	<div>Sql: {{template}}</div>
	</div>

	<div id="sql"></div>

	<script id="select_data" type="text/ng-template">
	select *
	from main_table
	where key = "{{title}}"
	and value = "{{title}}"
	order by {{order_by}}
	</script>

	<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
	<script src="app.js"></script>
	</body>

	</html>