Currently adding this button to my application.
In the button component, the following code is present:
@Input() callback: () => Promise<null>;
onClick() {
this.spinnerService.show();
this.callback().then(() => {
this.spinnerService.hide();
}, () => {
this.spinnerService.hide();
});
}
(Avoiding async / await as per the directive given by the "tech lead")
The template for the component:
<my-button [callback]="doSomething">
</my-button>
Everything seems to be functioning well when passing the mentioned code to the input of the component:
doSomething = () => {
return myService.doSomething()
.toPromise()
.then((response) => console.log('promise resolved'));
}
However, there is a need to exit from this function prematurely:
doSomething() {
if (condition) {
return;
}
return myService.doSomething()
.toPromise()
.then((response) => console.log('promise resolved'));
}
An error is encountered:
ERROR TypeError: Cannot read property 'then' of undefined
Attempts were made to create and force a promise with similar outcomes:
if (condition) {
return Promise.resolve(null);
// or
return new Promise((resolve) => { resolve(null); });
}