如何在Angular的单个服务文件中传递来自不同方法的值？答案

【问题标题】：How to pass values from different methods in single service file in Angular?如何在Angular的单个服务文件中传递来自不同方法的值？
【发布时间】：2019-03-30 03:13:57
【问题描述】：

我有一个服务文件，因为我有两个方法 getdata 和 delete，因为数据来自 API。 getdata 方法工作正常。

我在该 siteId 中的 delete() 中遇到问题，它没有读取任何数据。如果我单击保存按钮，它应该识别站点 ID 并删除该特定数据。但我认为我在服务文件和组件文件中写错了。

service.ts

datasites : Data
getData(): Promise<PagedResult<data>> {

  const url = `${environment.API_URL}/data/GetData`;
  //See that is a "simple" get
  return this.httpClient.get<PagedResult<data>>(url).toPromise();
}
delete(): Promise<Data>{
  alert(2);
  const siteId = this.datasites.principalId;
  const url = `${environment.ADMIN_API_URL}/sites/DeleteSite?siteId=`+ siteId;
  console.log(siteId);
  return this.httpClient.post<Sites>(url, request).toPromise();

}

组件.ts

async ngOnInit(){
      alert("***********");

      this.data = await this.dataService.getData();
      console.log(this.data[0].principalId);
       this.deleteSiteId = this.data[0].principalId;
       console.log(this.deleteSiteId);

    }
   delete(data){
     alert(aaaaaaaaa);
     this.dataService.delete(data);
     console.log(data.principalId);

   }
    showButtons: boolean = false;
  clickEvent(data){
    data.isClicked = !data.isClicked;
  this.showButtons = !data.showButtons;
}
  }

.html

<div *ngIf="showButtons">
      <button (click)="delete()">Save</button>
    </div>

【问题讨论】：

你必须首先使用 this.httpClient.delete 方法而不是 post 方法。第二件事你为什么不使用可观察的？？？
您需要更改return this.httpClient.delete<Sites>(url, request).toPromise();，另外一件事是您从组件发送的服务中的删除方法中没有参数，因此将delete() 更改为delete(request)
在他们仅使用 post 编写的 api 中。我尝试了 observable 也没有出现
您能解释一下为什么在 ngOnInit 上使用 async 吗？您是否尝试过使用邮递员
您需要根据点击的项目从前端 html 传递数据参数。您只是使用任何输入参数调用 delete 方法。

标签： html css angular typescript angular6

【解决方案1】：

我可以清楚地看到你的代码有太多问题。

最明显的一点是，您在使用的任何编辑器中都没有 linter。如果你有这个，你就会发现问题。 ;)

除此之外，您正在 component.ts 文件中调用 delete() 方法，没有任何参数，它确实需要.

您对 service.ts 文件中的 delete() 执行相同的操作，只是相反。呵呵

如果您可以在StackBlitz 或任何此类站点中复制上述问题，那将非常有用。

【讨论】：