From 4b75fb6123297792aa8a8c8a791880c72a71057a Mon Sep 17 00:00:00 2001 From: Sebastian Stehle Date: Thu, 18 Oct 2018 15:11:25 +0200 Subject: [PATCH] Change detector. --- .../content/shared/assets-editor.component.ts | 4 ++++ .../shared/references-editor.component.ts | 4 ++++ .../angular/forms/date-time-editor.component.ts | 13 +++++++------ .../angular/forms/dropdown.component.ts | 11 ++++++++++- .../framework/angular/forms/slider.component.ts | 16 ++++++++++++---- .../framework/angular/forms/stars.component.ts | 11 ++++++++++- .../angular/forms/tag-editor.component.ts | 9 ++++++++- .../framework/angular/forms/toggle.component.ts | 11 ++++++++++- .../components/geolocation-editor.component.ts | 5 ++++- 9 files changed, 69 insertions(+), 15 deletions(-) diff --git a/src/Squidex/app/features/content/shared/assets-editor.component.ts b/src/Squidex/app/features/content/shared/assets-editor.component.ts index fbb41ce25..ff4cc259c 100644 --- a/src/Squidex/app/features/content/shared/assets-editor.component.ts +++ b/src/Squidex/app/features/content/shared/assets-editor.component.ts @@ -74,11 +74,15 @@ export class AssetsEditorComponent implements ControlValueAccessor { } } else { this.oldAssets = ImmutableArray.empty(); + + this.changeDetector.detectChanges(); } } public setDisabledState(isDisabled: boolean): void { this.isDisabled = isDisabled; + + this.changeDetector.detectChanges(); } public registerOnChange(fn: any) { diff --git a/src/Squidex/app/features/content/shared/references-editor.component.ts b/src/Squidex/app/features/content/shared/references-editor.component.ts index f0defad85..019e59064 100644 --- a/src/Squidex/app/features/content/shared/references-editor.component.ts +++ b/src/Squidex/app/features/content/shared/references-editor.component.ts @@ -104,11 +104,15 @@ export class ReferencesEditorComponent implements ControlValueAccessor, OnInit { } } else { this.contentItems = ImmutableArray.empty(); + + this.changeDetector.detectChanges(); } } public setDisabledState(isDisabled: boolean): void { this.isDisabled = isDisabled; + + this.changeDetector.detectChanges(); } public registerOnChange(fn: any) { diff --git a/src/Squidex/app/framework/angular/forms/date-time-editor.component.ts b/src/Squidex/app/framework/angular/forms/date-time-editor.component.ts index a98d02f29..f435f1d5f 100644 --- a/src/Squidex/app/framework/angular/forms/date-time-editor.component.ts +++ b/src/Squidex/app/framework/angular/forms/date-time-editor.component.ts @@ -44,8 +44,12 @@ export class DateTimeEditorComponent implements ControlValueAccessor, OnDestroy, @Input() public hideClear: boolean; - public timeControl = new FormControl(); + @ViewChild('dateInput') + public dateInput: ElementRef; + public isDisabled = false; + + public timeControl = new FormControl(); public dateControl = new FormControl(); public get showTime() { @@ -56,11 +60,6 @@ export class DateTimeEditorComponent implements ControlValueAccessor, OnDestroy, return !!this.dateValue; } - @ViewChild('dateInput') - public dateInput: ElementRef; - - public isDisabled = false; - constructor( private readonly changeDetector: ChangeDetectorRef ) { @@ -122,6 +121,8 @@ export class DateTimeEditorComponent implements ControlValueAccessor, OnDestroy, this.dateControl.enable({ emitEvent: false }); this.timeControl.enable({ emitEvent: false }); } + + this.changeDetector.detectChanges(); } public registerOnChange(fn: any) { diff --git a/src/Squidex/app/framework/angular/forms/dropdown.component.ts b/src/Squidex/app/framework/angular/forms/dropdown.component.ts index f5819e39c..d8e8ff0bd 100644 --- a/src/Squidex/app/framework/angular/forms/dropdown.component.ts +++ b/src/Squidex/app/framework/angular/forms/dropdown.component.ts @@ -5,7 +5,7 @@ * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved. */ -import { AfterContentInit, ChangeDetectionStrategy, Component, ContentChildren, forwardRef, Input, QueryList, TemplateRef } from '@angular/core'; +import { AfterContentInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, forwardRef, Input, QueryList, TemplateRef } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; const KEY_ENTER = 13; @@ -46,6 +46,11 @@ export class DropdownComponent implements AfterContentInit, ControlValueAccessor public isDisabled = false; + constructor( + private readonly changeDetector: ChangeDetectorRef + ) { + } + public ngAfterContentInit() { if (this.templates.length === 1) { this.itemTemplate = this.selectionTemplate = this.templates.first; @@ -62,10 +67,14 @@ export class DropdownComponent implements AfterContentInit, ControlValueAccessor public writeValue(obj: any) { this.selectIndex(this.items && obj ? this.items.indexOf(obj) : 0); + + this.changeDetector.detectChanges(); } public setDisabledState(isDisabled: boolean): void { this.isDisabled = isDisabled; + + this.changeDetector.detectChanges(); } public registerOnChange(fn: any) { diff --git a/src/Squidex/app/framework/angular/forms/slider.component.ts b/src/Squidex/app/framework/angular/forms/slider.component.ts index f7baeb850..5f6a78a8f 100644 --- a/src/Squidex/app/framework/angular/forms/slider.component.ts +++ b/src/Squidex/app/framework/angular/forms/slider.component.ts @@ -5,7 +5,7 @@ * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved. */ -import { ChangeDetectionStrategy, Component, ElementRef, forwardRef, Input, Renderer2, ViewChild } from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, forwardRef, Input, Renderer2, ViewChild } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { Types } from '@app/framework/internal'; @@ -31,8 +31,6 @@ export class SliderComponent implements ControlValueAccessor { private value: number; private isDragging = false; - public isDisabled = false; - @ViewChild('bar') public bar: ElementRef; @@ -48,16 +46,26 @@ export class SliderComponent implements ControlValueAccessor { @Input() public step = 1; - constructor(private readonly renderer: Renderer2) { } + public isDisabled = false; + + constructor( + private readonly changeDetector: ChangeDetectorRef, + private readonly renderer: Renderer2 + ) { + } public writeValue(obj: any) { this.lastValue = this.value = Types.isNumber(obj) ? obj : 0; this.updateThumbPosition(); + + this.changeDetector.detectChanges(); } public setDisabledState(isDisabled: boolean): void { this.isDisabled = isDisabled; + + this.changeDetector.detectChanges(); } public registerOnChange(fn: any) { diff --git a/src/Squidex/app/framework/angular/forms/stars.component.ts b/src/Squidex/app/framework/angular/forms/stars.component.ts index dd30c81ad..26f45ef20 100644 --- a/src/Squidex/app/framework/angular/forms/stars.component.ts +++ b/src/Squidex/app/framework/angular/forms/stars.component.ts @@ -5,7 +5,7 @@ * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved. */ -import { ChangeDetectionStrategy, Component, forwardRef, Input } from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, forwardRef, Input } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { Types } from '@app/framework/internal'; @@ -52,12 +52,21 @@ export class StarsComponent implements ControlValueAccessor { public value: number | null = 1; + constructor( + private readonly changeDetector: ChangeDetectorRef + ) { + } + public writeValue(obj: any) { this.value = this.stars = Types.isNumber(obj) ? obj : 0; + + this.changeDetector.markForCheck(); } public setDisabledState(isDisabled: boolean): void { this.isDisabled = isDisabled; + + this.changeDetector.markForCheck(); } public registerOnChange(fn: any) { diff --git a/src/Squidex/app/framework/angular/forms/tag-editor.component.ts b/src/Squidex/app/framework/angular/forms/tag-editor.component.ts index 98d2068d6..3eb61f93d 100644 --- a/src/Squidex/app/framework/angular/forms/tag-editor.component.ts +++ b/src/Squidex/app/framework/angular/forms/tag-editor.component.ts @@ -5,7 +5,7 @@ * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved. */ -import { AfterViewInit, ChangeDetectionStrategy, Component, ElementRef, forwardRef, Input, OnDestroy, OnInit, ViewChild } from '@angular/core'; +import { AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, forwardRef, Input, OnDestroy, OnInit, ViewChild } from '@angular/core'; import { ControlValueAccessor, FormControl, NG_VALUE_ACCESSOR } from '@angular/forms'; import { Subscription } from 'rxjs'; import { distinctUntilChanged, map, tap } from 'rxjs/operators'; @@ -129,6 +129,11 @@ export class TagEditorComponent implements AfterViewInit, ControlValueAccessor, public addInput = new FormControl(); + constructor( + private readonly changeDetector: ChangeDetectorRef + ) { + } + public ngOnDestroy() { this.subscription.unsubscribe(); } @@ -179,6 +184,8 @@ export class TagEditorComponent implements AfterViewInit, ControlValueAccessor, } else { this.items = []; } + + this.changeDetector.detectChanges(); } public setDisabledState(isDisabled: boolean): void { diff --git a/src/Squidex/app/framework/angular/forms/toggle.component.ts b/src/Squidex/app/framework/angular/forms/toggle.component.ts index 2a7323fde..a5ec32156 100644 --- a/src/Squidex/app/framework/angular/forms/toggle.component.ts +++ b/src/Squidex/app/framework/angular/forms/toggle.component.ts @@ -5,7 +5,7 @@ * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved. */ -import { ChangeDetectionStrategy, Component, forwardRef } from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, forwardRef } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { Types } from '@app/framework/internal'; @@ -28,12 +28,21 @@ export class ToggleComponent implements ControlValueAccessor { public isChecked: boolean | null = null; public isDisabled = false; + constructor( + private readonly changeDetector: ChangeDetectorRef + ) { + } + public writeValue(obj: any) { this.isChecked = Types.isBoolean(obj) ? obj : null; + + this.changeDetector.detectChanges(); } public setDisabledState(isDisabled: boolean): void { this.isDisabled = isDisabled; + + this.changeDetector.detectChanges(); } public registerOnChange(fn: any) { diff --git a/src/Squidex/app/shared/components/geolocation-editor.component.ts b/src/Squidex/app/shared/components/geolocation-editor.component.ts index b47014d41..62e7775b6 100644 --- a/src/Squidex/app/shared/components/geolocation-editor.component.ts +++ b/src/Squidex/app/shared/components/geolocation-editor.component.ts @@ -5,7 +5,7 @@ * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved. */ -import { AfterViewInit, ChangeDetectionStrategy, Component, ElementRef, forwardRef, ViewChild } from '@angular/core'; +import { AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, forwardRef, ViewChild } from '@angular/core'; import { ControlValueAccessor, FormBuilder, NG_VALUE_ACCESSOR } from '@angular/forms'; import { @@ -71,6 +71,7 @@ export class GeolocationEditorComponent implements ControlValueAccessor, AfterVi public isDisabled = false; constructor( + private readonly changeDetector: ChangeDetectorRef, private readonly resourceLoader: ResourceLoaderService, private readonly formBuilder: FormBuilder, private readonly uiState: UIState @@ -103,6 +104,8 @@ export class GeolocationEditorComponent implements ControlValueAccessor, AfterVi } else { this.geolocationForm.enable(); } + + this.changeDetector.detectChanges(); } private setDisabledStateOSM(isDisabled: boolean): void {