app.component.ts 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. import { Component, OnInit, OnChanges, ViewChild, TemplateRef } from '@angular/core';
  2. import { FormGroup } from '@angular/forms';
  3. import { DynaformService } from './dynaform/services/dynaform.service';
  4. import * as test1 from './_mock/testfields.v1';
  5. import * as test2 from './_mock/testfields.v2';
  6. import * as test3 from './_mock/testfields.v3';
  7. import * as test4 from './_mock/testfields.v4';
  8. import * as test5 from './_mock/testfields.v5';
  9. import * as test6 from './_mock/testfields.v6';
  10. const testdata = [ test1, test2, test3, test4, test5, test6 ];
  11. @Component({
  12. selector: 'app-root',
  13. templateUrl: './app.component.html',
  14. styleUrls: ['./app.component.scss']
  15. })
  16. export class AppComponent implements OnInit, OnChanges {
  17. form: FormGroup;
  18. meta: StringMap;
  19. hCssRed = 'color: white; background-color: maroon; font-weight: bold;';
  20. hCssGreen = 'color: white; background-color: green; font-weight: bold;';
  21. @ViewChild('testTemplate', { read: TemplateRef })
  22. tref: TemplateRef<any>;
  23. constructor(
  24. private dynaform: DynaformService
  25. ) {
  26. }
  27. ngOnInit() {
  28. // Optionally supply the test to run in the query string e.g. ?test=3
  29. const testcase = parseInt(new URLSearchParams(document.location.search).get('test'), 10) || 2;
  30. const { model, meta } = testdata[testcase - 1];
  31. console.log('%c *** TEST DATA *** ', this.hCssRed);
  32. console.log('Model', model);
  33. console.log('Meta', meta);
  34. // Build the FormGroup and Modeled Metadata from the imported test data
  35. const dynaformdata = this.dynaform.build(model, meta);
  36. ({ form: this.form, meta: this.meta } = dynaformdata);
  37. console.log('%c *** Modeled MetaData *** ', this.hCssGreen);
  38. console.dir(this.meta);
  39. console.log('%c *** FormGroup *** ', this.hCssGreen);
  40. console.dir(this.form);
  41. }
  42. ngOnChanges() {
  43. console.log(this.form.errors);
  44. }
  45. }