Javascript 将数据从服务获取到我的组件

我的服务是下面的PortAllocationService

@Injectable({
  providedIn: 'root'
})
export class PortAllocationService {
  businessSwitchName: any;businessSwitchIp: any;businessSwitchportName: any;
  businessSwitchNodeId: any;routerName: any;routerIp: any;routerDetailsportName: any;
  routernodeID: any;aggSwitchName: any;aggSwitchPort: any;aggNodeIP: any;
  aggNodeId: any;serviceName: any;convertorDetails: any;handoffPort: any;qosLoopingPort: any;

  constructor(private http:HttpClient) { }

  portService(da){
    return this.http.post(url.portAllocationUrl , da).
    subscribe ((response:any) => {
      //Port Allocation response is mapped here
      console.log(response);
      // businessSwitchDetails 
      this.businessSwitchName = response.businessSwitchDetails.nodeName;
      this.businessSwitchIp = response.businessSwitchDetails.nodeIP;

     });

  }

我的组件如下所示

export class WimaxFormComponent {
  data : any = {};
  btsIp :any; vCategory:any;nVlan:any;
 businessSwitchName:any;businessSwitchIp:any;businessSwitchportName:any;
 routerName:any;routerIp:any;aggSwitchName:any;aggSwitchPort:any;
 routerDetailsportName:any;routernodeID:any;aggNodeIP: any;aggNodeId: any;
 businessSwitchNodeId: any;serviceName: any;convertorDetails: any;
 handoffPort: any;qosLoopingPort: any;
 serviceId: any;serviceType: any;customerName: any;
 vReservedValue:boolean;cVlan: string;sVlan: any;
 path: string;

   constructor(
  private service: PortAllocationService){

  }

onChange(){

  let portAllocationData = {
  "serviceAttribute": {
    "serviceType": this.serviceType,
    "category": "category",
    "name": this.serviceId
  },
  "btsIp": this.btsIp
}
console.log(portAllocationData);

  this.service.portService(portAllocationData);
}

当我调用onChange函数时，调用的是服务，我们从服务器得到响应。但我想访问从我的服务到组件的所有变量值，比如我在constructor和onChange中尝试过的

this.businessSwitchName=service.businessSwitchName//这是未定义的

---

您能告诉我如何将变量值访问到组件中吗。

与其订阅服务本身中的API调用，我只需返回http.post（）生成的可观察值。然后将订阅移动到组件本身：

服务：

portService(da){ return this.http.post(url.portAllocationUrl , da) });

this.service.portService(portAllocationData).subscribe(response => {
    // Do stuff with the response here
});

get businessSwitchName() {
    return this._businessSwitchName;
}

this.service.businessSwitchName

组件：

portService(da){ return this.http.post(url.portAllocationUrl , da) });

this.service.portService(portAllocationData).subscribe(response => {
    // Do stuff with the response here
});

get businessSwitchName() {
    return this._businessSwitchName;
}

this.service.businessSwitchName

---

但是，如果您确实希望在服务中保留变量，我会将API调用放在服务的构造函数中，将服务中的字段更改为以下划线（或其他一些本地/私有标识符）开头，然后为您希望访问的每个变量提供get方法

服务：

portService(da){ return this.http.post(url.portAllocationUrl , da) });

this.service.portService(portAllocationData).subscribe(response => {
    // Do stuff with the response here
});

get businessSwitchName() {
    return this._businessSwitchName;
}

this.service.businessSwitchName

组件：

portService(da){ return this.http.post(url.portAllocationUrl , da) });

this.service.portService(portAllocationData).subscribe(response => {
    // Do stuff with the response here
});

get businessSwitchName() {
    return this._businessSwitchName;
}

this.service.businessSwitchName

---

console.log（响应）中显示的内容？响应来自服务器。好吧，看一看，嘿，我不明白这个主题的概念。请您根据我问题中的上述代码实现它。这将非常有帮助。Thanks我一直在服务，因为我也想在其他组件中使用变量的值。@ImRaNJB，我添加了一个关于如何从服务访问数据的解释。我将如何在我的服务的构造函数中实现API调用？？？@ImRaNJB，我建议将API调用移动到构造函数，只是为了避免需要显式调用API方法。。。只需节省一步。但是，我看到您向API调用传递了一个对象。因此，您可能只需要显式地调用API方法（就像您目前所做的那样）。但其余答案仍然适用！@Nicholas，我已经尝试了您告诉我的方式，但是businessSwitchName仍然没有定义，因为在http请求/响应完成之前，获取businessSwitchName的代码会被执行并设置为未定义