'Node JS Backend Not Displaying Result on the Frontend of Angular

I have a project that is using Node JS as the backend communication to the Angular Frontend. I have buttons on the angular frontend for the 4 API Actions (Get, Post, Put, Delete). My backend is successfully calling my external API, executing one of the 4 API Actions when the corresponding button is clicked, and printing the results in the console. However, the results are not showing up on the angular frontend. Is there anything I need to check for to see why this is not working? I am not sure where to start with it.

HTML Code:

<form #documentNum="ngForm" (ngSubmit)="getDoc(documentNum.value)">
            <div class="input-group mb-3 spacing">
              <input type="text" value="" placeholder="Document Number" aria-label="Recipient's username"
                aria-describedby="basic-addon2" id="getDoc" name="getDoc" ngModel>
              <div class="input-group-append">
                <input class="btn btn-info" type="submit" value="GET" id="submit">
                <input class="btn btn-success" type="submit" name="_method" value="PUT">
                <input class="btn btn-danger" type="submit" name="_method" value="DELETE">   
                <input class="btn btn-warning y-btn" type="submit" value="POST" id="submit">
                              

              </div>
            </div>
        </form>

TypeScript:

import { Component, OnInit } from '@angular/core';
import { HttpClient, HttpParams } from '@angular/common/http';


@Component({
  selector: 'app-lab5',
  templateUrl: './lab5.component.html',
  styleUrls: ['./lab5.component.css']
})
export class Lab5Component implements OnInit {

  constructor(private http: HttpClient) { }
  ROOT_URL = 'http://localhost:3000/'
  //constructor(){}
  list:any;

  ngOnInit(): void {
  }

  getDoc(data: any) {
    this.http.get(this.ROOT_URL + 'db/' + (data.getDoc - 1)).subscribe(res => {
      this.list = res;
      console.log(this.list);
    })
  }

}

Node JS (for get verb):

app.get('/db/:number', async function (req, res) {

  await client.connect();
  const database = client.db("lab5");
  const coll = database.collection("players");
  var players = coll.find({}).toArray().then(() => {

   
    coll.find({}).toArray(function (err, symbols) {
      if (!err) {
        var output;
        var num = req.params.number;
        console.log(num);
        var all = symbols[num].data;
        

        res.send(all);

      }
      // client.close();
    });
  });

});


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source