Not passing Data from service method to the mongoose get route to query for data using Angular IO

Question

I am getting the data from the template to the component layer, then passing it to the service file. I see it in the console.log() on both levels. When I pass the variable in the method next to the route I want to hit in the server it is not getting passed or I am not accessing it correctly(probably the case) and I have bent this every way I know how.

When I console.log() in the NodeJS server (using express, body-parser, and mongoose) it returns {} with req.body , and undefined if I try to add a key on the end. With just req I get a HUGE responce but parsing through all the info all I can really see is the method key/value and the key/value of the route I am trying to access with my service file method.

I have tried everything I can think of I used the route in postman and it worked fine.

I console.loged req req.params and req.URL with no success.

The other files (component and service) are console.logging the data so I know it is being passed from a *ngFor in the template that is returning a query of all the 'tasks' stored in the database ( keys are title, description, and a default setting of false ). I really do not know what else to do.

I also had the same problem yesterday using a delete method and the findByIdAndDelete mongoose method. The id was being passed as a string from the template all the way to the service file but for some reason was not showing up in req, req.body, or req.body._id. The console.log() in the component and service file displayed this.

{ mongoose express / using json with the body-parser to return data}

app.get('/task-info', function(req, res){
    console.log('SERVER_:', req.body._id);
    Task.findById({_id: req.body.id}, function(err, task) {
        if(err){
            console.log('ERROR_QUERY_FOR_DATA_INFO:', err)
            res.json({message: 'ERROR_QUERY_FOR_DATA_INFO', data: err})
        } else {
            console.log('SUCCESS_QUERY_ONE_TASK_INFO');
            res.json({message: 'SUCCESS_QUERY_ONE_TASK_INFO', data: task})
        }
    })
})



{ http.service.ts    the console.log() is returning the task id }

 getTaskInfo(task) {
      console.log('SINGLE_TASK_INFO_SERVICE_FILE:', task._id);
      return this._http.get('task-info', task);
  }


{ app.component.ts    the console.log() is returning the entire task }

singleTask(task: any) {
      const observable = this._httpService.getTaskInfo(task);
      observable.subscribe(data => {
        console.log('SINGLE_TASK: ', data);
    });
  }



----The app.component.html----



<div>
        <h1>Tasks</h1>
        <ul *ngIf="allTasksList" class="all-tasks-ul">
            <li *ngFor="let task of allTasksList.tasks">{{ task.title }}
                <div class="edit-task-btn">
                    <button (click)="singleTask(task)">Info</button>
                </div>
                <div class="info-task-btn">
                    <button (click)="changeTask(task)">Edit</button>
                </div>
                <div class="delete-task-btn">
                    <button (click)="deleteOneTask(task._id)">Delete</button>
                </div>
            </li>
            <div *ngIf="editTask" class="editing-task-div">
                <h1>Editing {{ editTask.title }}</h1>
                <form (submit)="updateTask(editTask)">
                    <label>
                        Update Task:
                        <input type="text" name="editTask.title" [(ngModel)]="editTask.title" id="">
                    </label><br>
                    <label>
                        Update Task Description:
                        <input type="text" name="editTask.description" [(ngModel)]="editTask.description" id="">
                    </label><br>
                    <input type="submit" value="Update Task">
                </form>
            </div>
        </ul>
    </div>

SERVER_: undefined

this is what the conole is printing, then the error from the bad query. Like I said, in POSTMAN the same get retrieves the data.

Shorbagy Shorbagy · Accepted Answer · 2019-05-27T03:28:44

Firstly, You don't send body to GET Request never do that just send params or query params like this:

router.get('/getPost/:id', (req, res, next) => {
    let id = req.params.id;
    // Make your Query Here
})

In your Angular side use this

let id = task.id;
this._httpService.get(`task-info/${id}`);

Not passing Data from service method to the mongoose get route to query for data using Angular IO

1 Answers