Experiencing difficulty posting data programmatically, but having success using Swagger

When I try to post data using the following line of code, it does not insert data as expected, even though it works with loopback or swagger.

this.http.post(this.Root_url2 + 'busbookings', excelBody)

See the complete code below:

    import { HttpClient } from "@angular/common/http";
    import { Injectable } from "@angular/core";
    @Injectable()
    export class LoadexcelService {
    private Root_url2 = "http://localhost:3000/api/";
      constructor( private http: HttpClient) {
       }    

        postRouteList(routeExcel) {
            routeExcel.forEach((route) => {

            var excelBody = {
                "routeid":route.routeid,
                "from":route.from,
                "to":route.to,
                "price":route.price,
                "departuredate":route.departuredate,
                "departuretime":route.departuretime,
                "arrivaldate":route.arrivaldate,
                "busType":route.busType          
            }
            this.http.post(this.Root_url2 + 'busbookings', excelBody)    
       }); 
         }
    }

Interestingly, I do not encounter any issues when posting data through swagger via this link:

http://localhost:3000/api/

https://i.sstatic.net/Za2Bs.png

Answer №1

Observables remain inactive until they are subscribed to, requiring the use of the subscribe method for each one.

this.http.post(this.Root_url2 + 'busbookings', excelBody)
         .subscribe(res => console.log(res));

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

How can I effectively test a method within a React component using Jest and Typescript?

When working on .tsx components using Typescript and React, I want to write unit tests for the methods within my React component. For example: export default class SomeComponent extends React.Component<undefined, SomeComponentState> { someMetho ...

What are the steps for manually integrating Bootstrap into an Angular project?

I'm currently working on an Angular 5 project within a private domain where I am unable to utilize the npm-install command. As a result, I have manually added Bootstrap's CSS and JS files to my project. I am now unsure how to properly link these ...

Return to the previous page with different query parameters, not the same one

When it comes to reverting state location back by 1 step in Angular, we can utilize something along the lines of this.location.back();. This method works well unless the system redirects to the same URL but with different query parameters. In such cases, ...

The authService is facing dependency resolution issues with the jwtService, causing a roadblock in the application's functionality

I'm puzzled by the error message I received: [Nest] 1276 - 25/04/2024 19:39:31 ERROR [ExceptionHandler] Nest can't resolve dependencies of the AuthService (?, JwtService). Please make sure that the argument UsersService at index [0] is availab ...

AngularJS 2: Modifications to templates or components do not automatically reflect in the user interface

My background is in Angular 1, where everything worked seamlessly. However, I am encountering serious issues trying to create a basic application using Angular 2 in Visual Studio. After carefully following the "5 minute tutorial" and getting it to work, I ...

The communication between my Angular 2 application and the NodeJS server seems to be experiencing issues as I

I am a beginner in the world of MEAN stack development and could really use some assistance in troubleshooting an issue. app.js const express = require('express'); const app = express(); const path = require('path'); app.use(express. ...

Unable to locate a compatible version for caniuse-lite with the specified range of ^1.0.30001349

I encountered an error while running npm install: npm ERR! code ETARGET npm ERR! notarget No matching version found for caniuse-lite@^1.0.30001349. npm ERR! notarget In most cases you or one of your dependencies are requesting npm ERR! notarget a package v ...

The checkbox filter in Angular 6 has the ability to replace the previously selected

I've been working on creating a filter system using checkboxes. Below is a snippet of the code I'm currently using: filter.pipe.ts import { Pipe, PipeTransform, Injectable } from '@angular/core'; @Pipe({ name: 'filter2' }) ...

"Utilizing jQuery and Bootstrap 4 in TypeScript, attempting to close modal window using jQuery is not functioning

Trying to make use of jquery to close a bootstrap modal within an angular project using typescript code. The following is the code: function call in html: (click)="populaterfpfromsaved(i, createSaved, createProp)" createSaved and createProp are local ...

Encountering an Uncaught ReferenceError in Angular 8 and Webpack 4: Issue with vendor_lib not being defined plus source map error

Recently, I started working on a relatively simple interface that was initially developed in Angular2. As someone new to Angular2 and webpack, there were some challenges. I successfully upgraded the project from Angular 2.4 to Angular 8.0. Additionally, ...

Having constant problems with ngModel twoway binding. Any suggestions on how to successfully bind to a property in order to update an api link?

I am attempting to implement two-way binding in order to dynamically change the API endpoint when a button is clicked. The value attribute of the button should be used as part of the API URL string. I tried following an example in the Hero Angular App, bu ...

What could be causing the issue with my output not displaying correctly?

Hey guys! I'm working on creating a to-do list but I've encountered a problem. Whenever I enter a value in the text field, it doesn't get added to the array of list elements. Strangely enough, when I console.log it, it seems to work. Can any ...

Increasing the value of a TypeScript variable using ngFor in an HTML template can enhance its usefulness

Can you dynamically increase a variable declared in your TypeScript file for each element generated by an ngFor loop in your HTML file? <tbody> <tr *ngFor="let item of invoiceItems"> <td>{{item.ItemName}}</td> <td>{ ...

Attempting to showcase information on the Angular frontend

When attempting to retrieve the Street name, I am seeing [object Object]. What is the optimal approach for displaying JSON data on the client side? I managed to display a street name but struggled with other components. How can I access the other elements ...

When deploying my Angular project, I am unable to access my files

I have been facing challenges while trying to deploy my web application with the frontend being Angular. The issue I am encountering is that I cannot access my JSON file located in the assets folder. Below is the function I am using to retrieve data from ...

Exporting constants using abstract classes in TypeScript files

In my Typescript files, I've been exporting constant variables like this: export const VALIDATION = { AMOUNT_MAX_VALUE: 100_000_000, AMOUNT_MIN_VALUE: 0, DESCRIPTION_MAX_LENGTH: 50, }; My constant files only contain this one export without any ...

What causes type checks to be skipped when spreads are used on type-guarded types?

Query: Why doesn't a compile-time error occur when I overlook adding nested fields to an object of type T, while constructing the object using object spread? Illustration: interface User { userId: number; profile: { username: string } } f ...

Having trouble assigning an initial value to ngx-bootstrap typeahead

Hello there, I am currently using Angular version 16 with ngx-bootstrap version 11.0.2. I am facing an issue where I cannot set a default value for a control. When a user selects data from a suggestive search and it gets saved in the database, I want that ...

How can I modify the appearance of folders in FileSystemProvider?

I have created an extension for vscode that includes a virtual filesystem with fake directories and files. While the extension is functioning properly, I am facing some challenges in customizing certain aspects due to lack of documentation. 1) I need to u ...

Updating the state in React Native does not occur

I'm facing an issue where I can't seem to update the state using useState while coding in React Native. The component in question is a styled TextInput named SearchField. Can anyone help me figure out what I might be doing wrong that's preve ...