The template files that the plug-in provides are what will be turned into the source of the forms components. As each framework defines its components in a different way, template files will be different for every framework, perhaps even for every framework version.
The template files from a plug-in are copied out of the plug-in folder and into the templates folder specified during the Forms CLI project initialisation. This is so that the developers can modify these templates individually.
Sample Angular Template
| Code Block | ||
|---|---|---|
| ||
<ng-form name="<%interaction%>" class="bm-form" <%#showWhen%>ng-show="<%moduleName%>.<%showWhen%>()"<%/showWhen%>
<%#hideWhen%>ng-hide="<%moduleName%>.<%hideWhen%>()"<%/hideWhen%>>
<%&header%>
<%&elements%>
<%&footer%>
<ng-transclude ng-transclude-slot="pagination"></ng-transclude>
<button ng-click="<%moduleName%>.onSaveClick(<%moduleName%>.model)" ng-show="!<%moduleName%>.isSubForm">Submit</button>
</ng-form> |
...
| Info |
|---|
As every framework is different, there is no "one size fits all" solution. Some frameworks might not need templates (for example, the JSON plug-in simply writes JSON to files), others might need a handful of templates, others might need a mix of Javascript and HTML, JSX or even CSS. |
As per mustache documentation, we We have a very simple AngularJS ng-form element which uses the properties of the passed in element to create a HTML string representation of a form. It is important to note that whilst we have a data normalization step, the data that is passed to processForm can be freely modified by you to match your mustache templates.
...