如何从 angular 7 调用 web API return 布尔值？

Question

我正在处理 angular 7 我遇到了无法调用网络的问题 API return 来自 angular 7

的布尔值

那么如何在 angular 上调用网络 API 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 用于从 angular

调用网络 API

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

调用上面的函数时 return 仅布尔值 true 或 false

如果比较 excel 相同则 return 为真

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

已更新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

Answer 1

您可以使用@angular/core模块调用网络路由Http。

像这样导入：

import { HttpClient } from '@angular/common/http';

这样使用：

constructor(
    private http: HttpClient
) { }

test () {
    // with observable
    this.http.get('url').subscribe(result => {
        console.log(result);
    });

    // with promise
    this.http.get('url').toPromise().then(result => {
        console.log(result);
    });
}

不要忘记将此添加到您的 app.module.ts:

import { HttpClientModule } from '@angular/common/http';

// add it in your imports
@NgModule ({
    declarations: [],
    imports: [
        HttpClientModule
    ]
})

在您的情况下，您需要执行以下操作

Component.ts

import { YourService } from 'path/to/service';

...

constructor(
    private yourService: YourService,
) { }

...

async ngOnInit() {
    const result = await this.yourService.callMyFunction();
    console.log(result);
}

yourService.ts

async callMyFunction() {
    const result = await this.http.get(yourUrl);
    return result;
}

component.html

<p>{{result}}</p>

Answer 2

您需要使用 Angular 个中的 HttpClientModule 个。

要使用它，您必须将 HttpClientModule 导入到您的根模块中。

app.module.ts 或 core.module.ts

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

其次，您可以创建一个服务来处理请求背后的逻辑。

foo.service.ts

@Injectable({
  providedIn: 'root'
})
export class FooService {
  constructor(private http: HttpClient) {}

  get(): Observable<boolean> {
    return this.http.get<boolean>(<url>);
  }
}

正如您在代码中看到的那样，HttpClient 的方法是通用的，因此通过使用它，我们可以管理 API 响应具有布尔类型。

最后，您可以像下面这样在组件中使用您的服务；

constructor(private service: FooService) {}

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

我已经为你创建了一个stackblitz example。

如何从 angular 7 调用 web API return 布尔值？

How to call web API return Boolean from angular 7?

angular

angular-material

asp.net-core-webapi

angular7

angular-components

在您的情况下，您需要执行以下操作