Having trouble identifying the issue in this TypeScript code snippet.
Error reported on line 5, ".subscribe((response: { Token: string }) => {".
login() {
this.httpClient
.post('http://localhost:4000/signin', this.loginForm.value)
.subscribe((response: { Token: string }) => {
if (response.Token === undefined) {
this.authenticationFailed = true;
} else {
this.router.navigate(['customer']);
}
});
}
}
Perhaps consider using a parameter to specify the type?
login() {
this.httpClient
.post<{Token?: string}>('http://localhost:4000/signin',
+ this.loginForm.value)
.subscribe((response => {
if (response.Token === undefined) {
this.authenticationFailed = true;
} else {
this.router.navigate(['customer']);
}
});
This issue arises due to the type being only a string (please refer to the comment).
login() {
this.httpClient
.post('http://localhost:4000/signin', this.loginForm.value)
.subscribe((response: { Token: string }) => {
// You're defining Token as a string but then checking if it's undefined, which will always be false in Typescript
if (response.Token === undefined) {
this.authenticationFailed = true;
} else {
this.router.navigate(['customer']);
}
});
The solution is to define Token as a string or undefined:
.subscribe((response: { Token?: string }) => { /* ... */ })
By using ? before the type, Typescript will recognize that the variable/attribute can be the specified type OR undefined
I have a method structured as shown below: class Bar { public executeInWorker(cb: () => void): void; public executeInWorker(cb: () => Promise<void>): void | Promise<void>; public executeInWorker(cb: () => void | Promise< ...
I have three enums Country_INDIA, Country_USA,Country_AUSTRALIA. During runtime, the specific country name is determined (it could be either INDIA, USA, or AUSTRALIA). Is it possible to select the correct enum based on the country name at runtime? For in ...
I am having issues with validating the form below. The required validation message is not appearing for my input type="file" field, even though the validation works well for my other textboxes. How can I validate the input as a required field? Please see ...
One issue I faced was resolved by creating the function shown below : function setProperty<T extends Record<string, string>>(obj: T, key: keyof T) { obj[key] = "hello"; } However, when I tried to compile the code, I encountered an ...
Is there a way to update JSON values in a TypeScript example by incrementing likes or dislikes when a button is clicked?https://i.sstatic.net/aon03.png movies: any[] = [ { name: "Fan", likes: 0, dislikes: 0, unseen: 0, fimage: "/images/fan.jpg" }, ...
Is there a specific way to correctly type the following function in TypeScript? Assuming we have a function createMap() that requires: a prefix (e.g. foo) and a tuple of suffixes (e.g. ['a', 'b', 'c']) If we call createMap(& ...
Imagine you have the following object: const ROUTES = { PAGE_NO_PARAMS: '/hello/page/two', PAGE_R: '/about/:id', PAGE_Z: '/page/page/:param/:id', PAGE_N: '/who/:x/:y/:z/page', } as const Can we create a set ...
Within my Angular6 application, I am utilizing 'three.js' and 'three-decal-geometry'. Here is a snippet of the necessary imports: import * as THREE from 'three'; import * as OBJLoader from 'three-obj-loader'; import ...
Currently, I am in the process of upgrading AngularJS1 components to Angular6. My strategy involves creating wrappers for all existing AngularJS1 components by extending "UpgradeComponent" and storing them under the folder "directive-wrappers". However, wh ...
I've encountered an issue while trying to access a JSON GitHub service, receiving the error message NullInjectorError: No provider for Http! Although I've attempted to add providers throughout the code, my efforts have been unsuccessful. I' ...
I am currently following the Traversy Media MEAN stack front to back playlist on YouTube. However, I encountered an error after importing the flash-messages and I'm having trouble understanding it. I have tried looking at some GitHub issue pages, but ...
I have a transaction.component.html file that displays the app-deal-partners component. Every time the delete function is triggered, I want to refresh and reload the child component, which is the app-deal-partners component. I need to reload <app-deal- ...
https://i.sstatic.net/RpHnR.png Is there a way to create a kendo column chart with rounded borders similar to the image provided? Below is the code snippet I am currently using. Additionally, how can I customize the hover-over color for the columns in the ...
Given object A: interface A { boolProp: boolean, stringProp: string, numberProp: number, ...other props/methods... } Now, I need objects that contain one of the properties from A and set a default value for it, with other properties being irre ...
Currently, I am developing an angular feature module as a library to enable us to create individual modules without the need to rebuild the entire angular application. While this approach seems to be functioning well, my question is whether it is conside ...
After numerous failed attempts, I finally managed to successfully build and deploy my app on Heroku. However, when I tried to access it, all I got was an 'Application error'. The log for the successful build is as follows: -----> Node.js app d ...
We encountered an issue while running our Jasmine tests. When we execute: ng test --browsers=ChromeHeadless --code-coverage the tests are successful. However, if we run: ng test --watch=false --browsers=ChromeHeadless --code-coverage it fails and we r ...
I'm working on implementing a function that can add a chainable method for function composition. Here's what I have so far: Also see: TypeScript playground { const F = <T, U>(f: (a: T) => U) => { type F = { compose: <V ...
Having a dilemma with declaring the icon in my array that contains name and icon. export const SidebarMenuList: SidebarMenu[] = [ { name: "Discover", icon: <AiOutlineHome />, id: SidebarCategory.Discover, }, ] The SidebarMe ...
Currently, I am working on a Sign Up page using SolidJs and NestJS with Prisma. However, when I try to submit the form, I encounter an error that says POST 404 (Not Found) and this error is also returned by axios. Additionally, my setup includes postgres ...