Search code examples
angularangular-materialasp.net-core-webapiangular7angular-components

How to call web API return Boolean from angular 7?


I work on angular 7 I face issue I can't call web API return Boolean from angular 7

so how call web API on angular 7 return true or false

   [HttpGet]
    [Route("CompareExcel/SelectedOptions")]
    public IActionResult CompareExcel( int SelectedOptions)
    {
        var DisplayFileName = Request.Form.Files[0];
        string fileName = DisplayFileName.FileName.Replace(".xlsx", "-") + Guid.NewGuid().ToString() + ".xlsx";
        string Month = DateTime.Now.Month.ToString();
        string DirectoryCreate = Path.Combine(myValue1, Month);// myValue1 + "\\" + Month + "\\" + fileName;
        CExcel ex = new CExcel();
    
        string error = "";
        int rowCount = 0;
        var selectedFile = "";
        var filedata = ContentDispositionHeaderValue.Parse(Request.Form.Files[0].ContentDisposition).FileName.Trim('"');
        var dbPath = Path.Combine(DirectoryCreate, fileName);
        if (SelectedOptions == 1)
        {
            selectedFile = "Gen.xlsx";
        }
        else if(SelectedOptions == 2)
        {
            selectedFile = "DeliveryGeneration_Input.xlsx";
        }
        var InputfilePath = System.IO.Path.Combine(GetFilesDownload, selectedFile);
        using (var stream = new FileStream(dbPath, FileMode.Create))
        {
            Request.Form.Files[0].CopyTo(stream);
            stream.Flush();
            stream.Close();
        }
        GC.Collect();
        bool areIdentical = ex.CompareExcel(dbPath, InputfilePath, out rowCount, out error);
        if(areIdentical==true)
        {
            return Ok(true);
        
        }
        else
        {
            return Ok(false);
            
        }
    
    }

link used to call web API from angular

http://localhost:61265/api/DeliverySys/CompareExcel/SelectedOptions?=1

when call function above it return only Boolean true or false

if compare excel identical then return true

if compare excel Not identical then return false

so on angular service.ts
//what I write 
component Type script ts
what I write
html component
what I write 

updated post

on service ts i do as below :
CompareExcel(SelectedOptions)
{
  this.http.get('http://localhost:61265/api/DeliverySys/CompareExcel/SelectedOptions?=' + SelectedOptions).subscribe(result => {
    console.log(result);
});
}
on component ts
i call it as 

  this._dataService.CompareExcel(this.selectedoptions.toString())
so are this correct 

on component html 
what i write 

Solution

  • You need to use HttpClientModule of Angular.

    To use it, you have to import HttpClientModule into your root module.

    app.module.ts or core.module.ts

    @NgModule({
      imports: [..., HttpClientModule]
    })
    export class AppModule {} 
    

    Secondly, you can create a service to handle the logic behind the request.

    foo.service.ts

    @Injectable({
      providedIn: 'root'
    })
    export class FooService {
      constructor(private http: HttpClient) {}
    
      get(): Observable<boolean> {
        return this.http.get<boolean>(<url>);
      }
    }
    

    As you can see in the code, methods of HttpClient are generic, so by using it, we can manage that the API response has a boolean type.

    Finally, you can use your service in component like the following;

    constructor(private service: FooService) {}
    
      get(): void {
        this.service.get().subscribe(resp => {
          if (resp) {
            console.log('yayyy');
          } else {
            console.log('nooo');
          }
        });
      }
    

    I have created a stackblitz example for you.