Pass Angular Observable to ASP MVC via HTTPGET

Question

On the HTML, when you click the exportok() button below, I wish to send the current year (aka.2020) from the selected dropdown to the.NET MVC Controller function called EXPORT via a HTTPGET call "/api/stations/export”.

Admin.component.ts

exportyears = [
    {name: '1 July 2019 to 30 June 2020', id: '2019-2020'},
    {name: '1 July 2020 to 30 June 2021', id: '2020-2021'},
  ];

Admin.component.html

<form>
  <select formControlName="exportyear" [(ngModel)]="reportyear"(change)="onClickMe()">
    <option 
      *ngFor="let exportyear of exportyears" [ngValue]="exportyears"
    >
      {{ exportyear.id }}
    </option>
  </select>
</form>

<button class="btn btn-primary" type="button" (click)="exportOk(exportyears[0].id)">
<i class="glyphicon glyphicon-ok"></i>&nbsp;OK</button>

Service.ts

export(reportyear: string): Observable<Response> {
  
//  let headers = new Headers();
  //   headers.append('Content-Type', 'application/json');
 // headers.append('reportyear', reportyear);

  let request = new Request({
    method: RequestMethod.Get,
    url: environment.baseUrl + "/api/stations/export",
    responseType: ResponseContentType.Blob,
    body: {reportyear}
  }
);

Station.ts

exportOk(reportyear: string) {
  this.exporting = true;
  this.exportMessage = null;

  this.stationsService.export(reportyear)
    .subscribe(
      (res: Response) => {
        this.exporting = false;
        this.exportModal.hide();
        Utils.launchAttachment(res);
      },
      error => {
        this.exporting = false;
        if (error.error) {
          this.exportMessage = error.error;
        }
        else {
          this.exportMessage = error;
        }
      }
    );

ASP.NET MVC Controller Controller.cs

[HttpGet("export")]
  public async Task<IActionResult> Export([FromBody]string reportyear)
  {
    var obj = reportyear; //show me the year so I can use it further down the line…..
    var stations = await stationRepository.GetExportAsync();
    ......
  }

Answer 1

I have something like this, it may help you.

        /// <summary>
    /// Find a product by name
    /// </summary>
    /// <param name="Name"></param>
    /// <returns></returns>
    [HttpGet("{name}")]
    [ProducesResponseType(StatusCodes.Status200OK)]
    [ProducesResponseType(StatusCodes.Status404NotFound)]
    public async Task<IActionResult> GetByName(string name)
    {
        try
        {
            var item = await _productService.GetOneByName(name);

            if (item != null)
            {
                return Ok(item);
            }
            return NotFound();
        }
        catch (System.Exception ex)
        {
            return StatusCode(StatusCodes.Status500InternalServerError, ex.Message.ToJson());
        }
    }    

you can see that what is in the curly brackets [HttpGet("{name}")] matches what is in the function parameters GetByName(string name). Btw, I suggest you to use postman for debugging your api if you don't.

UPDATE
try this:

export(reportyear: string): Observable<Response> {

let request = new Request(
   {
      method: RequestMethod.Get,
      url: environment.baseUrl + "/api/stations/export" + "/" + reportyear,
      responseType: ResponseContentType.Blob
   }
);