CODEWITHSUNDEEP
angular
Lotte Lemmens
Lotte Lemmens

Reputation: 581

Ask childcomponent and wait for result

I have a parent component which is a list and a child component showing details and it allows a user to edit these details. I'm looking for a way to ask my child component whether it still has any unsaved changes before letting a user change the selection.

Current setup: parent (simplified): dx-tree-list with (onRowClick)="editStatus($event)"

    editStatus(event: any): void {
        this.getEditableStatus(event.data.id);
    }

    getEditableStatus(id: number): void {
        this._statusService.getEdit(id).subscribe(editableStatus => {
            this.selectedStatus = editableStatus;
        });
    }

<configuration-project-status-detail *ngIf="!!selectedStatus" [selectedStatus]="selectedStatus">
                </configuration-project-status-detail>

child:

    ngOnChanges(): void {
        if (!!this.selectedStatus) {
            this.selectedStatusCopy = _.cloneDeep(this.selectedStatus);
        }
    }

These changes are made on the copy so the list isn't updated at the same time.

So i need a way to check for changes on childcomponent (which has a function hasChanges, but compares to selectedStatus), so this may not be changed before checking, meaning it needs to be checked before 'getEditableStatus'. Is there any other way then passing a boolean to the child which then on its turn emits another value?

Upvotes: 1

Views: 23

Answers (1)

Lotte Lemmens
Lotte Lemmens

Reputation: 581

I found it, my original idea is not possible... This is:

@ViewChild(ProjectStatusDetailComponent, { static: false }) childComponent: ProjectStatusDetailComponent;

if (!!this.childComponent) {
   console.log(this.childComponent.hasChanges());
}

Upvotes: 1

Related Questions