Expression Binding

The missing feature in Polymer craved by many, was a possibility to use an expression inside of the template. So far, Polymer team did not decide to include it, so Typed Polymer gives that for you.

To not mess up native binding and make it clearly seen, Expression Binding uses triple mustache ({{{...}}}). Inside, it expects a valid function body (arguments will be provided). Be aware that it WILL throw an error if something is wrong, just as a normal function.

Example

@template(`[[name]] is [[age]] years old and <strong>{{{age >= 18 ? "can" : "cannot"}}}</strong> buy alcohol`)
class ExpressionTester extends TypedPolymer {
  @set(String) name: string;
  @set(Number) age: number;
  constructor(name: string, age: number) {
    super();
    this.name = name;
    this.age = age;
  }
}
ExpressionTester.register();

In the above, the triple mustache section will be put in a body for the new function and the reference to that function will be placed instead.