如何访问函数外部的数据-Angular/Javascript

我正在从另一个文件（组件）加载数据，当我从函数中对其进行控制台操作时，事件发生后，它会工作：

  updateSub(data) {
  console.log('attempting to print the subsid array' + 
  this.engagementService.orgSubSidNames)
  }

当我试图在这个范围之外，但在我的ngOnit范围内呼叫时 它的控制台是空的：

console.log('attempting to print the subsid array initially' + 
this.engagementService.orgSubSidNames)

所有代码都包含在我的ngOnit中。 我还将engagementService包含在我的构造函数中，这就是我访问它的方式：

 export class EngagementFilterComponent implements OnInit {

 constructor(private builder: FormBuilder, public engagementService:
 EngagementService) { }

 ngOnInit(): void {

 console.log('attempting to print the subsid array initially' + 
 this.engagementService.orgSubSidNames)

 } 
 }

在参与服务中，我进行如下http调用：

    organizationSubsidiaries(sfid: string) {
    const url = `${this.baseURL}/${ENDPOINTS.organizations}/${this.organization.id}/${ENDPOINTS.subsidiaries}`;
    return this.http.get(url).map(res => res.json());
  }

然后，当加载浏览器时，会像这样调用它，我会根据响应创建所需的数组：

        this.organizationSubsidiaries(id)
      .subscribe(data => {

        let subsidiaryNames = []
        data.forEach(sub => {
          console.log(sub.SubsidiaryName)
          subsidiaryNames.push(sub.SubsidiaryName)
        })
        subsidiaryNames = subsidiaryNames.filter(this.onlyUnique);
        this.orgSubSidNames = subsidiaryNames;
        console.log('data from subsidiaries' + JSON.stringify(this.orgSubSidNames))

      });

下面是另一个使用可观察对象的调用示例（我可能遗漏了这一点）：

allEngagementAreas（）：可观察{
constURL=`${this.baseURL}/${ENDPOINTS.engagementAreas}`；
返回这个.http.get（url.map）（res=>res.json（）作为IBaseEngagement[]）；
}

我想要在UI中显示的数组

---

我能做什么？

您需要的是一种让组件知道API调用何时完成的方法。要做到这一点，您可以从服务中返回一个可观察对象，并在组件中订阅它

例如，在您的服务中，您可以：

public getOrgSubsidiaries(id) {
    return this.organizationSubsidiaries(id).map(data => {
        let subsdiaryNames = [];
        // your logic
        return subsdiaryNames;
    });
}

然后，在组件内部，您可以执行以下操作：

ngOnInit(): void {
    this.engagementService.getOrgSubsidiaries(id).subscribe(data => {
        this.orgSubsidiaries = data;
    });
}

---

你能发布你的ngOnInit方法吗？是的，我现在就发布数据是来自ajax还是http调用？它是http调用哦，所以它不会只是在那里，是吗，因为它会在数据存在之前读取行，那么我该如何使用数据并分配数据呢？它无法识别试图订阅第一个数据的组件中的“id”？然后您可以直接去掉参数并调用该方法，并在服务中使用id。顺便说一下，.map不会返回任何信息，.subscribe与以前一样工作，但是.map不支持任何东西。当然，只是在使用您的函数时，它是完全相同的

ngOnInit(): void {
    this.engagementService.getOrgSubsidiaries(id).subscribe(data => {
        this.orgSubsidiaries = data;
    });
}