Search code examples
javascriptnode.jsangularangular-fullstack

angular http client is not working when calling node backend locally?


Trying to call nodejs local host using angular http client but it is not hitting the backend i have added url in the proxy.config in angular app as i added in the question that doesnt work either any idea ?

angular service.ts

import { Injectable } from '@angular/core';
import { HttpClient , HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs';

@Injectable({providedIn: 'root'})
export class AdminService {

  constructor(private http: HttpClient) { }

  private  url = "http://localhost:9001/api/saveClients";

  saveClientJobs(data) {
        let options = this.createRequestOptions();
        console.log("Service", data);
        return this.http.post(this.url, data, { headers: options });
    }

    private createRequestOptions() {
        let headers = new HttpHeaders({
            "Content-Type": "application/json"
        });
        return headers;
    }
}

angular proxy.config.json

{
  "/api/*":{
      "target":"http://localhost:9001",
      "secure":false,
      "logLevel":"debug",
      "changeOrigin": true
  }
}

NodeJs routes

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const admin_controller_1 = require("./api/admin/admin.controller");
class RegisterRouteClass {
    RegisterRoutes(app) {
        app.post('/api/saveClients', admin_controller_1.AdminController.save);
       
    }
}
exports.RegisterRouteClass = RegisterRouteClass;

Solution

  • In order for a post/get to be executed you need to subscribe to it. If you are not subscribing to the post/get, it will never execute thus nothing will be output in the network tab of the developer tools.

    saveClientJobs(data).subscribe(result => /* do something with the result */)