ng-dynaform/src/app/app.component.ts

import { Component, OnInit, OnChanges, ViewChild, TemplateRef } from '@angular/core';
import { FormGroup } from '@angular/forms';
import { DynaformService } from './dynaform/services/dynaform.service';

import * as test1 from './_mock/testfields.v1';
import * as test2 from './_mock/testfields.v2';
import * as test3 from './_mock/testfields.v3';
import * as test4 from './_mock/testfields.v4';
import * as test5 from './_mock/testfields.v5';
import * as test6 from './_mock/testfields.v6';
import * as test7 from './_mock/testfields.v7';
import * as test8 from './_mock/testfields.v8';

const testdata = [ test1, test2, test3, test4, test5, test6, test7, test8 ];

const defatltTest = 8;

@Component({
	selector: 'app-root',
	templateUrl: './app.component.html',
	styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit, OnChanges {

	form: FormGroup;
	meta: StringMap;

	hCssRed = 'color: white; background-color: maroon; font-weight: bold;';
	hCssGreen = 'color: white; background-color: green; font-weight: bold;';

	@ViewChild('testTemplate', { read: TemplateRef })
	tref: TemplateRef<any>;

	constructor(
		private dynaform: DynaformService
	) {
	}

	ngOnInit() {

		// Optionally supply the test to run in the query string e.g. ?test=3
		const testcase = parseInt(new URLSearchParams(document.location.search).get('test'), 10) || defatltTest;
		const { model, meta } = testdata[testcase - 1];

		console.log('%c *** TEST DATA *** ', this.hCssRed);
		console.log('Model', model);
		console.log('Meta', meta);

		// Test autoMeta
		const auto = this.dynaform.autoMeta(model);
		console.log(auto);

		// Test combine
		const m2 = this.dynaform.combineModelWithMeta(model, meta);
		console.log(m2);

		// Test building Field-Specific-Meta
		const fsm = this.dynaform.buildFieldSpecificMeta(m2);
		console.log(fsm);

		// Test building the FormGroup
		const fg = this.dynaform.buildFormGroup(fsm);
		console.log(fg);

		// Build the FormGroup and Modeled Metadata from the imported test data
		const dynaformdata = this.dynaform.build(model, meta);
		({ form: this.form, meta: this.meta } = dynaformdata);

		console.log('%c *** Modeled MetaData *** ', this.hCssGreen);
		console.dir(this.meta);
		console.log('%c *** FormGroup *** ', this.hCssGreen);
		console.dir(this.form);
	}

	ngOnChanges() {
		console.log(this.form.errors);
	}
}