Merge pull request #72 from LabShare/bigfixes

 fix: fixed checkbox input control

Author: KalleV

dist/ngx-forms.js

@@ -26,7 +26,6 @@
     "@angular/platform-browser-dynamic": "^6.0.4",
     "bootstrap": "^4.0.0",
     "core-js": "^2.4.1",
-    "lodash": "4.17.10",
     "ngx-chips": "^1.9.1",
     "ngx-quill": "^3.1.0",
     "quill": "^1.3.4",

package.json

@@ -1,10 +1,8 @@
 <div class="row" [formGroup]="group">
-    <label class="col-md-2 font-weight-bold  col-form-label">{{ field.label }}
+    <label class="col-md-2 font-weight-bold col-form-label">{{field.label}}
         <span class="required-icon" [hidden]="!field.required">*</span>
     </label>
     <div class="col-md-10">
-        <div class="row" *ngFor="let item of field.options">
-            <label class="col-md-6"><input type="checkbox" [formControlName]="field.name">{{ item }}</label>
-        </div>
+        <input type="text" class="form-control" [attr.placeholder]="field.placeholder" [formControlName]="field.name">
     </div>
-</div>
+</div>

src/app/components/form-checkbox/form-checkbox.component.html

@@ -1,5 +1,5 @@
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { FormCheckboxComponent as Type } from './form-checkbox.component';
+import { FormCheckboxComponent as Type} from './form-checkbox.component';
 import { ReactiveFormsModule, FormsModule, FormGroup, FormControl } from '@angular/forms';
 import { APP_BASE_HREF } from '@angular/common';
 import { By } from '@angular/platform-browser';
@@ -8,7 +8,7 @@ describe('FormCheckboxComponent', () => {
     let component: Type;
     let fixture: ComponentFixture<Type>;
     let directiveEl;
-    let value = "bbb";
+    let value = true;
 
     beforeEach(async(() => {
         TestBed.configureTestingModule({
@@ -25,15 +25,14 @@ describe('FormCheckboxComponent', () => {
                 fixture = TestBed.createComponent(Type);
                 component = fixture.componentInstance;
 
-                component.field = { type: "checkbox", name: "test", required: true, options: ['aaa', 'bbb', 'ccc'] };
+                component.field = { type: "text", name: "test", required: true };
                 component.group = new FormGroup({
                     test: new FormControl('')
                 });
                 component.group.patchValue({
                     test: value
                 });
 
-
                 fixture.detectChanges();
             });
     }));
@@ -43,8 +42,8 @@ describe('FormCheckboxComponent', () => {
     });
 
     it('ensures component is rendered', () => {
-        directiveEl = fixture.debugElement.queryAll(By.css('input'));
-        expect(directiveEl.length).toEqual(component.field.options.length);
+        directiveEl = fixture.debugElement.query(By.css('input'));
+        expect(directiveEl.nativeElement.value.toString()).toEqual(value.toString());
     });
 
     it('ensures required asterix appears', () => {

src/app/components/form-checkbox/form-checkbox.component.spec.ts

@@ -1,14 +1,13 @@
 import { Component } from '@angular/core';
-import { Field } from '../../models/field.interface';
 import { FormGroup } from '@angular/forms';
+import { Field } from '../../models/field.interface';
 import { IFieldConfig } from '../../models/field-config.interface';
 
 @Component({
     selector: 'form-checkbox',
     template: require('./form-checkbox.component.html')
 })
-
-export class FormCheckboxComponent implements Field {
+export class FormCheckboxComponent implements Field  {
     field: IFieldConfig;
     group: FormGroup;
     model: object;

src/app/components/form-checkbox/form-checkbox.component.ts

@@ -2,7 +2,6 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { FormInputHiddenComponent } from './form-hidden.component';
 import { ReactiveFormsModule, FormsModule, FormBuilder, FormGroup, FormControl } from '@angular/forms';
 import { APP_BASE_HREF } from '@angular/common';
-import * as _ from 'lodash';
 import { By } from '@angular/platform-browser';
 
 describe('FormInputHiddenComponent', () => {

src/app/components/form-hidden/form-hidden.component.spec.ts

@@ -1,14 +1,12 @@
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { FormInputComponent as Type} from './form-input.component';
-import { ReactiveFormsModule, FormsModule, FormBuilder, FormGroup, FormControl } from '@angular/forms';
+import { ReactiveFormsModule, FormsModule, FormGroup, FormControl } from '@angular/forms';
 import { APP_BASE_HREF } from '@angular/common';
-import * as _ from 'lodash';
 import { By } from '@angular/platform-browser';
 
 describe('FormInputComponent', () => {
     let component: Type;
     let fixture: ComponentFixture<Type>;
-    const formBuilder: FormBuilder = new FormBuilder();
     let directiveEl;
     let value = "Some Test Value";
 
@@ -35,7 +33,6 @@ describe('FormInputComponent', () => {
                     test: value
                 });
 
-
                 fixture.detectChanges();
             });
     }));

src/app/components/form-input/form-input.component.spec.ts

@@ -2,7 +2,6 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { FormLabelComponent as Type } from './form-label.component';
 import { ReactiveFormsModule, FormsModule, FormBuilder, FormGroup, FormControl } from '@angular/forms';
 import { APP_BASE_HREF } from '@angular/common';
-import * as _ from 'lodash';
 import { By } from '@angular/platform-browser';
 
 describe('FormInputHiddenComponent', () => {

src/app/components/form-label/form-label.component.spec.ts

@@ -2,7 +2,6 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { FormRadioComponent } from './form-radio.component';
 import { ReactiveFormsModule, FormsModule, FormBuilder } from '@angular/forms';
 import { APP_BASE_HREF } from '@angular/common';
-import * as _ from 'lodash';
 
 describe('FormRadioComponent', () => {
     let component: FormRadioComponent;

src/app/components/form-radio/form-radio.component.spec.ts

@@ -2,7 +2,6 @@ import { Component } from '@angular/core';
 import {Field} from '../../models/field.interface';
 import { FormGroup } from '@angular/forms';
 import { IFieldConfig } from '../../models/field-config.interface';
-import * as _ from 'lodash';
 
 @Component({
     selector: 'form-radio',

src/app/components/form-radio/form-radio.component.ts

@@ -3,7 +3,6 @@ import { FormTextEditorComponent } from './form-text-editor.component';
 import { ReactiveFormsModule, FormsModule, FormBuilder } from '@angular/forms';
 import { APP_BASE_HREF } from '@angular/common';
 import { QuillModule } from "ngx-quill";
-import * as _ from 'lodash';
 
 describe('FormTextEditorComponent', () => {
     let component: FormTextEditorComponent;

src/app/components/form-text-editor/form-text-editor.component.spec.ts

@@ -2,7 +2,6 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { FormTextareaComponent } from "./form-textarea.component";
 import { ReactiveFormsModule, FormsModule, FormBuilder } from '@angular/forms';
 import { APP_BASE_HREF } from '@angular/common';
-import * as _ from 'lodash';
 
 describe('FormTextareaComponent', () => {
     let component: FormTextareaComponent;

src/app/components/form-textarea/form-textarea.component.spec.ts

@@ -21,7 +21,11 @@ export class FormNavService {
     }
 
     reset() {
+        this.groups.forEach((group) => {
+            group.hidden = false;
+        });
         this.groups = [];
+        this.selected = 0;
     }
 
     addWatcher(ref: { groups: any[]; }): any {