How to use a Get() to see a response in Angular

Question

I'm struggling to implement a API call on a page and was wondering where I am going wrong with the Subscribe/Observe method, right now I have the following code:

import { Component, OnInit } from '@angular/core';
    import { Router } from '@angular/router';
    import { appRoutesNames } from 'src/app/app.routes.names';
    import { coachInteractionRouteNames } from '../coach-integration.routes.names';
    import { createSessionRouteNames } from '../create-session/create-session.routes.names';
    import { coachMatchMakingRouteNames } from './coach-matchmaking.routes.names';
    import { CoachGenericResponse,SupportAreaCategory } from './coach-matchmaking.model';
    import { HttpClient } from '@angular/common/http';
    
    @Component({
      selector: 'app-coach-matchmaking',
      templateUrl: './coach-matchmaking.component.html',
      styleUrls: ['./coach-matchmaking.component.scss']
    })
    export class CoachMatchmakingComponent implements OnInit {
      appService: any;
      coachService: any;
      supportAreas: any;
      http: any;
    
      constructor(private readonly router: Router, http: HttpClient) { }
    
         
      ngOnInit(): void {
        this.getCategories().subscribe;
      }
    
      
    
      //API Loading
    
    private userAccessURL = "https://uks-tst-tbp-gw.azurewebsites.net/Business/GetCategories";
    
    getCategories = () => {
      return this.http.get(this.userAccessURL);
    }
    
    }

But there is nothing in the Console/Network areas of the page so it looks like no API is loading at all, can anyone help?

score 0 · Answer 1 · answered Jul 14 '22 at 18:52

0

  this.getCategories().subscribe(res=>{console.log('GetCategories Resoibse',res)})

answered Jul 14 '22 at 18:52

Ejaz Arain

72
4

'Resoibse' is this supposed to be Resolve? – SCOCB Jul 14 '22 at 19:27

score 0 · Answer 2 · answered Jul 14 '22 at 19:55

I recommend reading into rxjs and how Observables work as you will frequently be using them in Angular. In your particular example, you would need to do the following to subscribe:

ngOnInit() {
    this.getCategories().subscribe((data) => {
        // data contains your API response
    });
}

Or, if you prefer to work with Promises, you can convert your observable to a promise, like so:

import { lastValueFrom } from 'rxjs';

//...

ngOnInit() {
    lastValueFrom(this.getCategories()).then((data) => {
        // data contains your API response
    });
}

ok, that is something to research, thanks, so am I right in think it would be something like: ngOnInit() { this.getCategories().subscribe((data) => { console.log(URL); }); } — SCOCB, Jul 15 '22 at 06:37

How to use a Get() to see a response in Angular

2 Answers2