toggle-edit-view
v0.4.2
Published
Generates view-only and editable templates
Downloads
3
Maintainers
Readme
#JS-Templator
Generates matched view-only and editable templates for JavaScript objects.
##ROADMAP
- Using Polymer and handlebars
- Type-based dispatch
- Auto-wiring changes
- Using normal HTML elements and es6 template strings
##Example
let templ = Templator.wrap({
foo: true,
bar: 3,
baz: new Date()
});
templ.getTemplate(); // returns null, we haven't told it to watch any properties yet
templ.watch('foo', 'My Property');
Now calling .getTemplate()
will return a document fragment containing the following:
<table class="editable-view">
<tr class="edit-toggle">
<td>My Property</td>
<td>{{foo}}</td>
</tr>
<tr class="edit-toggle is-hidden">
<td>
<paper-dropdown-menu label="My Property" class="edit-changes" prop-name="foo">
<paper-menu class="dropdown-content">
<paper-item>False</paper-item>
<paper-item>True</paper-item>
</paper-menu>
</paper-dropdown-menu>
</td>
</tr>
</table>