从 angular 9 服务类进行休息 api 调用

Question

I have written an Api as part of a coding exercise and am testing it in Postman as below. I'm content with how this works for now.

So now I'm wanting to call it from an Angular 9 project and I've written a service with code below but don't know how to assign the three parameters to the parameter 'model'

This is my service class

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { map } from 'rxjs/operators';

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

  baseUrl = 'http://localhost:5000/api/Calculator/';

  constructor(private http: HttpClient) { }

  calculate(model: any) {
    return this.http.get(this.baseUrl, model)
      .pipe(map((response: any) => {
        const val = response;
      }));
  }

}

This is my component, and I'm wanting to call the service within getAnswerFromApi() but am not sure how to assign the three parameters

import { Component, OnInit } from '@angular/core';
import { CalcService } from '../_services/calc.service';

@Component({
  selector: 'app-calculator',
  templateUrl: './calculator.component.html',
  styleUrls: ['./calculator.component.css']
})
export class CalculatorComponent implements OnInit {
  title = 'Ofgem Calculator';

  model: any = {};

  subText = ''; // The text that should appear in the sub-display
  mainText = ''; // The text that should appear in the main display
  firstNumber: number; // The first operand
  secondNumber: number; // The second operand
  operator = ''; // The operator
  calculationString = '';
  // This is the string that denotes the operation being performed
  answered = false;
  operatorSet = false;

  answer = '';

  constructor(private calcService: CalcService) { }

  ngOnInit() {
  }

  pressKey(key: string) {
    if (key === '/' || key === 'x' || key === '-' || key === '+') {
       const lastKey = this.mainText[this.mainText.length - 1];
       if (lastKey === '/' || lastKey === 'x' || lastKey === '-' || lastKey === '+')  {
         this.operatorSet = true;
       }
       if ((this.operatorSet) || (this.mainText === '')) {
         return;
       }
       this.firstNumber = parseFloat(this.mainText);
       this.operator = key;
       this.operatorSet = true;
    }
    if (this.mainText.length === 10) {
      return;
    }
    this.mainText += key;
 }

 getAnswerFromApi() {
   this.calculationString = this.mainText;
   this.secondNumber = parseFloat(this.mainText.split(this.operator)[1]);

   this.calcService.calculate(this.model).subscribe(next => {
     console.log('did calc');
   }, error => {
     console.log('failed calc');
   });

 }
  allClear() {
    this.subText = '';
    this.mainText = '';
    this.operator = '';
    this.calculationString = '';
    this.answered = false;
    this.operatorSet = false;
  }
}

Answer 1

this is how to do it

// service file

 .....    

calculate() {
    return this.http.get(this.baseUrl)
  }

......

// component ts file

getAnswerFromApi() {
   ....

   this.calcService.calculate()
    .subscribe((next : any) => {
     this.model = next;
   }, error => {
     console.log('failed calc', error);
   });

 }