Having trouble retrieving information from a controller action in .NET Core and Angular 2

My Angular 2 service:

private checkEmailAvailabilityUrl = 'api/admin/checkemailavailability';
checkEmailAvailability(email: string): Observable<boolean> {
    let params = new URLSearchParams();
    params.set('email', email);
    return this.http
        .get(this.checkEmailAvailabilityUrl, { search: params })
        .map((response: Response) => {
            return this.extractData(response);
        });
    }

My controller action:

[Route("[action]")]
[HttpGet]
public async Task<IActionResult> CheckEmailAvailability(string email)
{
    return Json(new Json("success", false));
}

I set a breakpoint in Visual Studio, but the application does not reach it. I also attempted to include [FromQuery] for email, but it did not resolve the issue. What steps should I take to address this?

Answer №1

According to the details provided in the Documentation

The http.get method does not immediately send the request. It is mentioned that this Observable is considered cold, indicating that the request will only be sent once something actually subscribes to the Observable.

This implies that it is essential to subscribe to your Observable. Ultimately, you must invoke the subscribe function on it to trigger the actual request.

private verifyUserEmailUrl = 'api/admin/verifyuseremail';

verifyUserEmail(email: string): Observable<boolean> {
    let params = new URLSearchParams();
    params.set('email', email);
    return this.http
        .get(this.verifyUserEmailUrl, { search: params })
        .map((response: Response) => {
            return this.extractData(response);
        })
        .subscribe((data) => /* Your code here */);
    }

Answer №2

It appears that your controller has incorrectly mapped the URL. Please refer to the correct mapping provided below.

[Route("api/admin/verifyuseremail")]

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Achieving the incorporation of multiple components within a parent component using Angular 6

Within parent.component.html The HTML code I have implemented is as follows: <button type="button" class="btn btn-secondary (click)="AddComponentAdd()">Address</button> <app-addresse *ngFor="let addres of collOfAdd" [add]="addres">< ...

styled components are having issues with background gradients and opacity not functioning properly

Hello, I am currently working with styled components and have the following global style code: const GlobalStyle = createGlobalStyle` html{ font-family: roboto; background: linear-gradient(45deg,rgba(137,255,255,0.5),rgba(161,252,143, 0 ...

What is the method in TypeScript for defining a property in an interface based on the keys of another property that has an unknown structure?

I recently utilized a module that had the capability to perform a certain task function print(obj, key) { console.log(obj[key]) } print({'test': 'content'}, '/* vs code will show code recommendation when typing */') I am e ...

Ways to vertically adjust text using ngStyle depending on the condition

I've been attempting to conditionally align text using ngStyle, but I haven't had any success yet. This is the code I have come up with so far: <div [ngStyle]="{'display':totalRegisters<=10 ? 'inline-block; text-align: ...

Variety of editions tailored to individual clients

In my development of an Angular 6 application that I plan to distribute to multiple clients, there is a need for customization specific to each client while also maintaining common elements. My vision is to organize the directory structure as follows: /s ...

The 'toBeInTheDocument' property is not found on the 'Matchers<HTMLElement>' type

Having trouble setting up testing for a components library. Despite trying various examples and similar threads, I have not been successful. I can confirm that my setupTests.ts file is being loaded correctly (verified through a console.log). Additionally, ...

A guide on iterating through various JSON arrays and displaying them in AngularJS

I'm in the process of developing a new school management system and I need to showcase the list of departments along with the courses being offered by each department. The course information is saved in JSON format within the database. Here is my JSO ...

Best practices for managing CSV files in Next.js with TypeScript

Hello, I am currently working on a web application using nextjs and typescript. One of the features I want to implement is a chart displaying data from a csv file. However, I am not sure if using a csv file is the best choice in the long run. I may end up ...

Troubleshooting the error message "TypeError: Cannot read property 'name' of undefined" when working with data binding in Angular 4

I am brand new to Angular and I have been working on creating a custom Component. Specifically, I am trying to display a list of Courses (objects) which consist of two properties: id and name. So far, this logic is functioning properly. However, when attem ...

Issues persist with the implementation of async in Angular2+

In my Angular2+ component, I created a function that outputs the results before actually running the function. This causes the desired output to appear later than expected. The function sends a variable parameter with an HTTP request to a NodeJS backend an ...

Apply a specific style to the initial element generated by *ngFor

My current method for displaying a certain number of * characters is utilizing the code snippet below: <div *ngFor="let line of lines; let i=index">*</div> I am interested in applying a margin only to the first element. The margin value sh ...

What is a way to merge all the letters from every console.log result together?

I'm encountering an issue - I've been attempting to retrieve a string that provides a link to the current user's profile picture. However, when I use console.log(), the output appears as follows: Console Output: Below is my TypeScript code ...

Subscribe to a new Observable once the previous one completes

I need assistance in getting the current user after logging in. When I use this.router.navigate([this.returnUrl]); it does not work. Can someone please help me identify what is wrong here and how I can fix it? onSubmit(): void { this.authService.logi ...

Issue: Module "mongodb" could not be found when using webpack and typescript

I am encountering an issue while trying to use mongoose with webpack. Even though I have installed it as a dependency, when attempting to utilize the mongoose object and execute commands, it gives me an error stating that it cannot find the "." Module. Thi ...

Clicking the button will trigger the onclick event

I'm working on a button component in TypeScript and I have encountered an issue with passing the event to the submitButton function. import * as React from 'react'; interface Props { className?: string; text: string; onClick?(event: Reac ...

Encountering errors during 'npm i' - issues arising from unresolved dependency tree

Recently, I have been facing issues with running npm i as it keeps failing and showing an error. The project is using Angular 15 without any previous errors, so it's puzzling why there is suddenly a complaint about Angular 16. npm ERR! code ERESOLVE n ...

Struggling with optimizing assets in Jenkins pipeline causing Webpack build to get stuck

My Angular2 app uses webpack for both development and build purposes. While building my sources (webpack --profile --bail) on my local machine, the webpack process completes successfully. However, when running the same command in my Jenkins CI pipeline, t ...

How does [name] compare to [attr.name]?

Question regarding the [attr.name] and [name], I am utilizing querySelectorAll in my Typescript as shown below: this._document.querySelectorAll("input[name='checkModel-']") However, when I define it in the HTML like this: <input [name]="check ...

An unusual occurrence of events may occur when serverTimestamp fields are added to a Firestore collection alongside new elements

I've developed a web application where users can share messages on a specific topic. I'm utilizing Firebase as the backend with data stored in Firestore. Each message object contains an ID, content, creation timestamp, and last updated timestamp. ...

The ngOnChanges lifecycle hook does not trigger when the same value is updated repeatedly

Within my appComponent.ts file, I have a property called: this._userMessage Afterwards, I pass it to the childComponent like so: <child-component [p_sUserMessage]='_userMessage'></child-component> In the childComponent.ts file: @ ...