Merging changes from AMP iteration

README.md

@@ -1,3 +1,4 @@
 # NgDynaform
 
-Beakout project to develop Dynamic Form Builder module
+Beakout project to develop Dynamic Form Builder module
+

src/app/dynaform/components/clarity/password/clr-password.component.html

@@ -1,3 +1,4 @@
 <clr-password-container>
+	<label>{{ label }}</label>
     <input clrPassword [formControl]="control" [placeholder]="placeholder" />
 </clr-password-container>

src/app/dynaform/components/clarity/password/clr-password.component.ts

@@ -8,6 +8,6 @@ import { NativeInputComponent } from '../../_abstract/native-input.component';
 })
 export class ClrPasswordComponent extends NativeInputComponent {
 
-	exposeMetaInTemplate: string[] = ['placeholder'];
+	exposeMetaInTemplate: string[] = ['label', 'placeholder'];
 
 }

src/app/dynaform/dynaform.component.html

@@ -83,7 +83,7 @@
 
 
 <ng-template let-control="control" let-meta="meta" #dynaform>
-	<div [ngClass]="meta.class">
+	<div [ngClass]="getRowClass(control, meta)">
 		<h3 *ngIf="meta.label" class="h-dyna" [ngClass]="'h-dyna-' + (path.length + 2)">{{ meta.label }}</h3>
 		<app-dynaform [formGroup]="control" [meta]="meta.meta" [template]="template" [ngClass]="{ 'dyna-hidden': !meta.focussed }" (call)="handleCallback($event)"></app-dynaform>
 	</div>

src/app/dynaform/dynaform.component.ts

@@ -3,7 +3,6 @@ import { FormBuilder, FormControl, FormGroup, FormArray, FormGroupName, Abstract
 import { SuperForm } from 'angular-super-validator';
 import { buildFormGroupFunctionFactory } from './services/_formdata-utils';
 import { cloneDeep } from 'lodash/fp';
-import { unwrapResolvedMetadata } from '@angular/compiler';
 
 export interface DynarowContext {
 	control: AbstractControl;
@@ -14,7 +13,7 @@ export interface DynarowContext {
 	selector: 'app-dynaform',
 	templateUrl: './dynaform.component.html',
 	styleUrls: ['./dynaform.component.scss'],
-	changeDetection: ChangeDetectionStrategy.OnPush
+	changeDetection: ChangeDetectionStrategy.Default // or ChangeDetectionStrategy.OnPush - might be more efficient. Experiment later.
 })
 export class DynaformComponent implements OnInit {
 
@@ -153,7 +152,7 @@ export class DynaformComponent implements OnInit {
 	getRowClass(control: FormControl, meta: StringMap<any>): string {
 		const fieldTypeClass = meta.type ? meta.type.toLowerCase().replace('component', '') : '';
 		const fieldClass = Array.isArray(meta.class) ? meta.class.join(' ') : meta.class;
-		const containerClass = fieldClass ? ` container-${fieldClass}` : '';
+		const containerClass = fieldClass ? (meta.type === 'Container' ? ` ${fieldClass}` : ` row-${fieldClass}`) : '';
 		const errorClass = control && control.touched && control.invalid ? ' dyna-error' : '';
 		return `row-${fieldTypeClass}${containerClass}${errorClass}`;
 	}

src/app/dynaform/models/field.model.ts

@@ -250,7 +250,6 @@ class CheckbuttonGroup extends CheckboxGroup {
 	type = 'CheckbuttonGroup';
 }
 
-
 // ---------------------------------------------------------------------------------------------------------------------
 // Concrete Implementations - Kendo Form Components
 
@@ -286,8 +285,10 @@ class Container {
 	label = '';
 	seed: StringMap<any>;
 	template?: TemplateRef<any>;
-	button: string;	
-	focussed: boolean = true;	
+	button: string;						// IS THIS ACTUALLY USED?
+	focussed: boolean = true;			// IS THIS ACTUALLY USED?
+	class?: string | string[];
+	id?: string;
 	meta: StringMap<any>; // TODO: Tighten up on type with union type
 	constructor(containerMeta: StringMap<any>) {
 		Object.assign(this, containerMeta);

src/app/dynaform/services/dynaform.service.ts

@@ -117,7 +117,7 @@ export class DynaformService {
 	private context: any;
 
 	public buildFormGroup: (meta) => FormGroup;
-	private buildStrategy: 'MODELFIRST' | 'METAFIRST' = 'MODELFIRST'; // Make ENUM type
+	private buildStrategy: 'MODELFIRST' | 'METAFIRST' = 'METAFIRST'; // Make ENUM type
 	private callbacks: ICallbacks = {};
 
 	private conGreen = 'color: white; background-color: green; font-weight: bold;';
@@ -129,7 +129,7 @@ export class DynaformService {
 	setBuildStrategy(str): void {
 		switch (str.toUpperCase()) {
 			case 'MODELFIRST':	// Build from model, combining optional extra metadata
-			case 'METAFIRST':	// Build from metadata, sourcing values from the model (usindg meta's 'source' attribute)
+			case 'METAFIRST':	// Build from metadata, sourcing values from the model (optionally, using meta's 'source' attribute)
 				this.buildStrategy = str.toUpperCase();
 				break;
 			default: