Issue with Angular not sending data to ASP.net server

Attempting to send data to my asp.net server using angular. After testing the front-end data, the issue arises when sending the data with a post request; angular sends null data instead. Interestingly, when sending the same data to the server from Postman, it works perfectly fine and the response is true, as expected. Unsure of what might be missing in the front-end setup...

Snippet of angular code with post request:

// Set admin ID to object and create new school
schoolData.AdminId = 0;

const schoolHeaders = { 'Content-Type': 'application/json' };
const schoolBody = schoolData;
this.http.post<any>(this.baseUrl + "Api/CreateSchool", { body: JSON.stringify(schoolBody) }, { headers: schoolHeaders }).subscribe(schoolResponse => {
            
    if (schoolResponse) {
        this.router.navigate(['/home']);
    }

}, error => console.error(error));

Corresponding asp.net code snippet:

[HttpPost]
[Route("Api/CreateSchool")]
public bool CreateNewSchool([FromBody] SchoolModel schoolData)
{
    // IT PRINTS THE NAME ONLY FROM POSTMAN NOT IF THE REQUEST IS FROM ANGULAR
    Console.WriteLine("Name is: " + schoolData.Name);
    SchoolManager context = HttpContext.RequestServices.GetService(typeof(SchoolManager)) as SchoolManager;
    return context.CreateNewSchool(schoolData);
}

Answer №1

I needed to delete the {} elements within

{ body: JSON.stringify(schoolBody) }

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

Align watermark content to the far left side

Having trouble getting my watermark to align properly on the left side of my website's main content. Here is how it currently looks: https://i.sstatic.net/Nfhh5.png The issue arises when I resize the screen or switch to mobile view, as the watermark ...

Navigating from Angular 16 to Flask and experiencing browser refresh: A guide on redirecting to the 'root' path

As a newcomer to Angular, I was given the task of developing a single-page application (SPA) user interface frontend that communicates with a Flask server. Things were going smoothly until I encountered an issue when the user decides to hit the refresh but ...

Unidirectional data flow from the document object model to the variable within the

When working with Angular, there are multiple methods available for binding variables to DOM properties. You can utilize the `{{}}` syntax, `[property]=expression`, or implement two-way ngModel binding. One aspect that I have not yet discovered is how to ...

Angular is unable to bind to 'dirUnless' because it is not recognized as a valid property

I am seeking to implement a custom directive that acts as the opposite of *ngIf. Below is the code I have written for this custom directive: import { Directive, TemplateRef, ViewContainerRef, Input } from '@angular/core'; @Directive({ sele ...

The property you are trying to access is not defined on the enum type in Types

Looking to revise the TypeScript syntax of a lesson found at this link. I am aiming to extract a specific type from a union type using the following syntax: Actions['type'][ActionTypes.FEED_CREATE_POST] The available action types are defined a ...

What is the best method for converting an Object with 4 properties to an Object with only 3 properties?

I have a pair of objects: The first one is a role object with the following properties: Role { roleId: string; name: string; description: string; isModerator: string; } role = { roleId:"8e8be141-130d-4e5c-82d2-0a642d4b73e1", ...

Is there a way to make the vss sdk treeview collapse automatically?

Is there a way to have the nodes of a combo control of type TreeView.ComboTreeBehaviorName collapsed by default? I've searched through the documentation at this link and this link, but couldn't find a solution. I also examined the types in vss. ...

Encountering a challenge when upgrading to eslint version 9.0.0

Encountering an issue while trying to upgrade eslint to version 9.0.0. ⋊> ~/A/fusion on turborepo ⨯ bun lint 22:21:58 $ eslint packages/*/src/**/* Oops! Something went wrong! :( ESLint: 9.0. ...

Experience the magic of animated number counting using RxJs

I am working on my Angular application and I want to implement a feature where the records from HTTP get requests are animatedly counted. However, when using RxJs, the response is returned too quickly and I only see the final result immediately. I attemp ...

Utilizing Angular's ngIf directive to output the result of a condition

In my project, there is a unique card-list element that has the capability to display either elements from the card component or the card-edit component based on the value of the wasEditClicked property in the card component. The structure of the card-lis ...

Angular 7 - Merging Objects and Arrays

I have two models, Userc (with fields name, phone, email, etc.) and Usercco (same as Userc with an additional field coname for company name). In Userc model, I have coid field representing the company id. In my database (Firebase), I only have Userc and C ...

Is there a way to navigate to a specific div when clicking on it?

Need help with scrolling after running code function scrollFunction() { document.getElementById('insert').scrollIntoView(); } I have a button that triggers some code and I want the page to scroll afterwards. Currently, it scroll ...

Tips for syncing the state data stored in local storage across all tabs with Ngxs state management

After converting the state data to base64 format using the Ngxs state management library, I am saving it. While I can retrieve all data across different tabs, any changes made in one tab do not automatically sync with other tabs. A tab refresh is required ...

Enforce Interface through agreement

Here is a brief example: public abstract class Foo { publi string Name {get;set;} } public class SomeClass : Foo {} After using this code, I am interested in ensuring that anyone who inherits from the Foo Class also implements a specific Interface as a ...

Decorators are not allowed in this context, the Angular component constructor may not include them

Currently working on developing a dialog component in Angular 17 using Angular Material 17 Encountering an issue inside the constructor of the dialog component where utilizing the @Inject decorator as shown in the official documentation example is not pos ...

The primary origin of TypeScript is derived from the compiled JavaScript and its corresponding source map

Being new to sourcemaps and typescript, I am faced with a project that has been compiled into a single javascript file from multiple typescript files. The files available to me are: lib.js (the compiled js code of the project) lib.js.map (the source map ...

Implementing a JQuery modal with backend coding

I have encountered a problem in my ASP.NET code-behind where I am trying to incorporate a modal popup. Despite my efforts, I have not been able to successfully implement it. Do you have any suggestions on how I should proceed with this process? <scrip ...

Is it necessary to unsubscribe from an Angular HTTP-Request when using switchMap?

I have a question about managing subscriptions in my Angular application. I'm currently using the combineLatest operator to create an observable from two Angular observables, route.params and route.queryParams. This combined observable is then used as ...

Encountering a TypeError while working with Next.js 14 and MongoDB: The error "res.status is not a function"

Currently working on a Next.js project that involves MongoDB integration. I am using the app router to test API calls with the code below, and surprisingly, I am receiving a response from the database. import { NextApiRequest, NextApiResponse, NextApiHandl ...

Showing an in-depth ngFor post on the screen

I am in the process of building a Blog with Angular 7, MongoDB, and NodeJS. Currently, I have developed a component that iterates through all the posts stored in the database and showcases them on a single page. <div class="container-fluid"> < ...