It seems like I'm struggling with a simple question due to my lack of experience in this area. Any guidance or help would be greatly appreciated.
I have a button that should trigger multiple functions when clicked, all defined in the same ts file. While the onClick() function works (confirmed by logging statements), the calls to other functions within it do not execute.
The code snippet below should provide more clarity on my issue:
HTML:
<button type="submit"
class="btn btn-success"
(click)="onSaveChanges()">
Save Changes
</button>
TS:
private populateToDeleteArray = () => {
this.groupsToDelete = this.originalUserAssociatedGroups
.filter(i1 => !this.pickListUserAssociatedGroups
.some(i2 => i1.id === i2.id));
}
private populateToPostArray = () => {
this.groupsToPost = this.pickListUserAssociatedGroups
.filter(i1 => !this.originalUserAssociatedGroups
.some(i2 => i1.id === i2.id));
}
The remaining two functions are structured similarly... Followed by the onClick():
onSaveChanges = () => {
console.log('Huh?');
this.populateToDeleteArray();
this.populateToPostArray();
this.sendDeleteRequests();
this.sendPostRequests();
}
Although the console.log message is printed, the other functions are not being called. This has left me feeling puzzled.
Thank you for any assistance provided!