How to pass a string parameter from angular UI to node js backend

0 votes

I try to take the input in enteredValue and pass it on to http.get call as params:this.enteredValue and to node.js as req.params,as you can see below if I hardcode the string value for "orgChange",it works fine but somehow passing params is not working and throwing errors?any guidance on how to fix this?

html:

<textarea rows="6" [(ngModel)]="enteredValue"></textarea>
<hr>
<button (click)="get_change_lifecycle_data()">Search</button>

<p>{{newPost | json }}</p>

component

import { Component, OnInit, Injectable } from '@angular/core';
import { HttpClient } from "@angular/common/http";
import { Subject } from "rxjs";
import { map } from 'rxjs/operators';

@Component({
  selector: 'app-change-input',
  templateUrl: './change-input.component.html',
  styleUrls: ['./change-input.component.css']
})


export class ChangeInputComponent  {

constructor(private http: HttpClient) {}

enteredValue : any;
newPost : any;
get_change_lifecycle_data(){
     this.http.get('http://localhost:3000/api/change_life_cycle2',{params:this.enteredValue}).subscribe(response => {
     console.log(response);
      this.newPost = response
      });
}

}
Apr 22, 2020 in Angular by kartik
• 37,490 points
2,849 views

1 answer to this question.

0 votes

Hello Kartik,

There are three ways to get parameters to express:

  1. req.query --> this case, query parameters
  2. req.body --> post request body payload
  3. req.params --> /:someParam in url params

It should be req.query.searchKey.

Change the query to like this: u need to pass different params with different names:

this.http.get('http://localhost:3000/api/change_life_cycle2', 
  {
    params:{
    searchKey: this.enteredValue
    }
  }).subscribe(response => {
    console.log(response);
    this.newPost = response
});

In API side read the params in the request like this:

app.get("/api/change_life_cycle2", (req, res, next) => {
    console.log(req.body)
     Change_life_cycle.find({ orgChange: req.query.searchKey }).then(documents => {
        res.status(200).json({
          message: "Posts fetched successfully!",
          posts: documents
        });
      });
    });
answered Apr 22, 2020 by Niroj
• 82,540 points

Related Questions In Angular

0 votes
0 answers

How to call a node file from Angular function?

I have a button in my webpage ...READ MORE

Nov 9, 2020 in Angular by Viswa
• 140 points

closed Nov 9, 2020 by Gitika 43 views
0 votes
2 answers

How to detect a route change in Angular?

Hii Kartik For Angular 7 someone should write like: this.router.events.subscribe((event: Event) ...READ MORE

answered Apr 22, 2020 in Angular by Niroj
• 82,540 points
9,135 views
0 votes
1 answer

How can I strip HTML tags from a string in ASP.NET?

Hello @Kartik, If it is just stripping all HTML tags ...READ MORE

answered Jul 23, 2020 in Angular by Niroj
• 82,540 points
127 views
0 votes
1 answer

How to know tools and bundlers after create a new workspace or a project in angular?

Hello @sajal, When you create projects and workspaces ...READ MORE

answered Aug 6, 2020 in Angular by Niroj
• 82,540 points
91 views
0 votes
1 answer

What is meant by passing the variable by value and reference in PHP?

Hello, When the variable is passed as value ...READ MORE

answered Mar 27, 2020 in PHP by Niroj
• 82,540 points
235 views
0 votes
1 answer

Connection with MySQL server using PHP. How can we do that?

Hey @kartik, You have to provide MySQL hostname, ...READ MORE

answered Mar 27, 2020 in PHP by Niroj
• 82,540 points
129 views
0 votes
1 answer

How to retrieve or obtain data from the MySQL database using PHP?

Hello kartik,  Actually there are many functions that  ...READ MORE

answered Mar 27, 2020 in PHP by Niroj
• 82,540 points
227 views
0 votes
1 answer

What are the differences between mysqli_connect and mysqli_pconnect?

Hello, mysqli_pconnect() function is used for making a persistence ...READ MORE

answered Mar 27, 2020 in PHP by Niroj
• 82,540 points
594 views
0 votes
1 answer

How to call a node function from Angular ?

Hello, For your query you can refer this:https://www.codegrepper.c ...READ MORE

answered Nov 9, 2020 in Angular by Niroj
• 82,540 points
106 views
0 votes
1 answer

How to get parameter value from query string?

Hello @kartik, Using component <Route path="/users/:id" component={UserPage}/> this.props.match.params.id The component is ...READ MORE

answered Jul 22, 2020 in Angular by Niroj
• 82,540 points
345 views