/**
* AngularJS-style minimal template parser.
* Original use case is supporting AngularJS style print templates.
+ * Template context data is applied only once at parsing time, there
+ * is no Angular-style data binding.
*
* Supports the following template constructs:
* {{variables}}
import {Injectable, EventEmitter} from '@angular/core';
import {FormatService} from '@eg/share/util/format.service';
+// Internal class for modeling a single template parsing instance.
class ParserInstance {
private context: any;
- private domNode: HTMLElement;
private format: FormatService;
- private evalEnv: string;
// FormatService injected by ParserService
constructor(format: FormatService) {
const doc = parser.parseFromString(html, "text/html");
// Parsing as html wraps the content in an <html><body> wrapper
- this.domNode = doc.getElementsByTagName('body')[0];
+ const domNode = doc.getElementsByTagName('body')[0];
- this.traverse(this.domNode);
+ this.traverse(domNode);
- return this.domNode.innerHTML;
+ return domNode.innerHTML;
}
// Process each node in the in-progress document.
// Find the value within the context at the given path.
getContextStringValue(dotpath: string): string {
- const value = this.getContextValueAt(dotpath);
- // TODO IDL stuff when possible for formatting (e.g. dates)
- return this.format.transform({value: value});
+
+ // Variable replacements may contain filters.
+ const pieces = dotpath.split('|');
+ const path = pieces[0].trim();
+ const filter = pieces[1];
+ const data = {
+ value: this.getContextValueAt(path)
+ };
+
+ // Apply some minimal filter handling for now
+ // TODO: teach the format service about processing due dates.
+ if (filter) {
+ filter = filter.trim();
+ if (filter.startsWith('date')) {
+ data.datatype = 'timestamp';
+ } else if (filter.startsWith('currency')) {
+ data.datatype = 'money';
+ }
+ }
+
+ return this.format.transform(data);
}
}
<div>{{dest_address.street1}}</div>
<div>{{dest_address.street2}}</div>
</div>
- <div>Slip Date: {{today}}</div>
+ <div>Slip Date: {{today | date:foo}}</div>
+ <div>Cost: {{cost | currency}}</div>
<ol>
<li ng-repeat="copy in copies">
<div>Barcode: {{copy.barcode}}</div>
boolTrue: true,
boolFalse: false,
today: new Date(),
+ cost: 23.3,
copies: [
{barcode: 'abc123', title: 'welcome to the jungle', parts: ['a', 'b', 'c']},
{barcode: 'def456', title: 'hello mudda, hello fadda', parts: ['x','y']}