@stratio/egeo
Version:
144 lines (140 loc) • 5.27 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8">
<title>Stratio Egeo - Documentation</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" type="image/png" href="assets/images/favicon.png">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
</head>
<body class="container-fluid">
<a href="/index.html">Go Back to index</a><br>
<h1 id="dynamicformcomponent">Dynamic form (Component)</h1>
<p>The form component allows to generate forms dynamically using a JSON schema.</p>
<h2 id="inputs">Inputs</h2>
<table class="table table-striped">
<thead>
<tr>
<th id="property">Property</th>
<th id="type">Type</th>
<th id="req">Req</th>
<th id="description">Description</th>
<th id="default">Default</th>
</tr>
</thead>
<tbody>
<tr>
<td>parentName</td>
<td>String</td>
<td>False</td>
<td>Name of the parent section. By default, it is undefined</td>
<td></td>
</tr>
<tr>
<td>nestingLevel</td>
<td>String</td>
<td>False</td>
<td>This informs about the nesting level of the form. This input is only used for design purposes</td>
<td>0</td>
</tr>
<tr>
<td>forceValidations</td>
<td>Boolean</td>
<td>False</td>
<td>Boolean to force the field validations</td>
<td></td>
</tr>
<tr>
<td>disabledSectionMessage</td>
<td>String</td>
<td>False</td>
<td>Message displayed when a section is disabled. This is always displayed after the section name</td>
<td>'for this instance is disabled.'</td>
</tr>
<tr>
<td>sectionDescriptionLevel</td>
<td>Number</td>
<td>False</td>
<td>Level of the section to which description is displayed. By default, section descriptions are not displayed.</td>
<td>-1</td>
</tr>
<tr>
<td>textFieldMaxWidth</td>
<td>Number</td>
<td>False</td>
<td>Maximum width of a field needed to paint a input or textarea</td>
<td></td>
</tr>
<tr>
<td>errorMessages</td>
<td>StInputError</td>
<td>False</td>
<td>Field error translations</td>
<td></td>
</tr>
<tr>
<td>showTooltips</td>
<td>Boolean</td>
<td>False</td>
<td>Enable or disable displaying of tooltips By default, tooltips are displayed</td>
<td>-1</td>
</tr>
<tr>
<td>translations</td>
<td>StFormFieldTranslations</td>
<td>False</td>
<td>Field translations</td>
<td></td>
</tr>
<tr>
<td>schema</td>
<td></td>
<td>False</td>
<td>{StFormSchema Form schema needed to generate the form</td>
<td></td>
</tr>
</tbody>
</table>
<h2 id="outputs">Outputs</h2>
<table class="table table-striped">
<thead>
<tr>
<th id="property">Property</th>
<th id="type">Type</th>
<th id="description">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>valueChange</td>
<td>Any</td>
<td>Event emitted when value is changed. This emits the current form value</td>
</tr>
<tr>
<td>clickLink</td>
<td>String</td>
<td>Event emitted when link is clicked. It returns the field path</td>
</tr>
</tbody>
</table>
<h2 id="example">Example</h2>
<pre><code class="html language-html"><st-form [schema]="jsonSchema"
[(ngModel)]="model"
#formModel="ngModel">
</st-form>
</code></pre>
<h2 id="models">Models</h2>
<p><em>Form Schema</em> (StFormSchema)</p>
<pre><code class="typescript language-typescript">
</code></pre>
<p><em>Form UI Definition</em> (StFormUIDefinition)</p>
<pre><code class="typescript language-typescript">export interface StFormUIDefinition {
relatedTo ? : string;
visible ? : {
[key: string]: any
}
</code></pre>
</body>
</html>