Bladeren bron

Fix for setValue/patchValue targeting Checkbutton

Richard Knight 6 jaren geleden
bovenliggende
commit
9322cfb0a0

+ 7 - 7
src/app/_mock/testfields.v1.ts

@@ -147,16 +147,16 @@ const basicTestContainer = new fmd.Container({
 const model = {};
 
 const meta = {
-	basicTextField,
-	styledTextField,
-	textareaField,
-	passwordField,
-	selectField,
-	radioField,
+	// basicTextField,
+	// styledTextField,
+	// textareaField,
+	// passwordField,
+	// selectField,
+	// radioField,
 	checkboxField,
 	// disabledTextField,
 	// radioFieldHorizontal,
-	// checkbutton,
+	checkbutton,
 	// dropdownModifiedInput,
 	// checkboxGroup,
 	// checkbuttonGroup,

+ 17 - 10
src/app/dynaform/components/custom/checkbutton/checkbutton.component.ts

@@ -1,4 +1,4 @@
-import { Component, forwardRef, OnChanges } from '@angular/core';
+import { Component, OnChanges, forwardRef, ChangeDetectorRef } from '@angular/core';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
 import { CustomInputComponent } from './../../_abstract/custom-input.component';
 
@@ -18,20 +18,27 @@ export class CheckbuttonComponent extends CustomInputComponent implements OnChan
 
 	exposeMetaInTemplate: string[] = ['label', 'value', 'disabled', 'checkedValue', 'onChange'];
 
+	label: string;
 	value?: string | boolean = true;
 	isChecked: boolean;
 	disabled = false;
-	currentValue: string | boolean;
-	checkedValue: string | boolean = true;
-	onChange: (val) => {};
+	currentValue: string | number | boolean;
+	checkedValue: string | number | boolean = true;
+	onChange: (val) => void;
+
+	constructor(private _cdr: ChangeDetectorRef) {
+		super();
+	}
 
 	ngOnChanges() {
 		this.disabled = this.meta.disabled;
 	}
 
-	private toggleChecked(e): void {
-		e.target.blur();
-		e.preventDefault();
+	private toggleChecked(e?): void {
+		if (e) {
+			e.target.blur();
+			e.preventDefault();
+		}
 		if (this.disabled) { return; }
 		this.isChecked = !this.isChecked;
 		this.currentValue = this.isChecked ? this.value || this.checkedValue : false;
@@ -46,9 +53,9 @@ export class CheckbuttonComponent extends CustomInputComponent implements OnChan
 	}
 
 	public writeValue(value: any): void {
-		// this.isChecked = (value && value !== 0 && value !== 'false') ? true : false;
+		value = value ? this.checkedValue : false;
 		this.isChecked = !!value;
-		console.log(this.isChecked);
-		this.currentValue = this.isChecked ? this.value || this.checkedValue : false;
+		this.currentValue = this.isChecked ? this.checkedValue : false;
+		this._cdr.markForCheck(); // We have to manually trigger change detection when using setVAlue or patchValue from outside this component
 	}
 }

+ 3 - 0
src/app/dynaform/models/field.model.ts

@@ -169,6 +169,9 @@ class CheckboxField extends SimpleField {
 	rowLabel: null;
 	constructor(meta: ISimpleFieldMetaData) {
 		super(meta);
+		if (meta.value) {
+			this.checkedValue = meta.value;
+		}
 		if (meta.checkedValue) {
 			this.checkedValue = meta.checkedValue;
 		}

+ 0 - 2
src/app/dynaform/services/dynaform.service.ts

@@ -170,9 +170,7 @@ export class DynaformService {
 	updateForm(newModel: StringMap<any>, form?: FormGroup, meta?: StringMap<any>): void {
 		const mapping = extractFieldMappings(meta || this.meta); // Memoize
 		const mappedModel = this.modelMapper.reverseMap(newModel, mapping);
-		console.log('MAPPED MODEL', mappedModel);
 		(form || this.form).patchValue(mappedModel);
-		setTimeout(() => console.log(form || this.form));
 	}
 
 	buildNewModel(originalModel: StringMap<any>, formVal?: StringMap<any>, meta?: StringMap<any>): StringMap<any> {