Angular http服务调用后未更新数组对象

我正在处理一个场景，在这个场景中，我必须使用rest调用从springboot检索对象列表，并使用angular 5将它们填充到UI中

我的组件看起来像这样

export class BusinessComponent implements OnInit {

  serviceSavings:Services[] = [];

  constructor(private ServicesService:ServicesService) {
  }

  ngOnInit() {
    this.ServicesService.getServicesByCatID(PRODUCTSAVINGSID)
      .subscribe(serviceSavings => this.serviceSavings = serviceSavings);

    console.log("The length of serviceSavings :", this.serviceSavings.length); //this always prints zero.
  }

  examplemethod() {
    console.log("The length of serviceSavings :", this.serviceSavings.length);
  }
}

  getServicesByCatID(categoryid){
    return this.http.get(this.getServiceUrlByCategory(categoryid))
      .map(res => res.json());
  }

现在的问题是init（）方法中的log语句打印服务的0行。我需要从列表中检索每个服务并对其执行一些操作

当我在用户定义的方法中放置相同的日志，比如在UI中使用用户操作调用它。它在数据库表中显示列表的精确计数

在应用程序加载期间，我需要在init（）中编写一些业务逻辑，以便在UI中显示某些值

但在应用程序加载时，init（）中检索的列表长度始终为0。我无法遍历值。我认为arrayobject有一些更新问题

我的服务方式是这样的

export class BusinessComponent implements OnInit {

  serviceSavings:Services[] = [];

  constructor(private ServicesService:ServicesService) {
  }

  ngOnInit() {
    this.ServicesService.getServicesByCatID(PRODUCTSAVINGSID)
      .subscribe(serviceSavings => this.serviceSavings = serviceSavings);

    console.log("The length of serviceSavings :", this.serviceSavings.length); //this always prints zero.
  }

  examplemethod() {
    console.log("The length of serviceSavings :", this.serviceSavings.length);
  }
}

  getServicesByCatID(categoryid){
    return this.http.get(this.getServiceUrlByCategory(categoryid))
      .map(res => res.json());
  }

springboot应用程序完全可以从后端返回对象列表，没有问题

---

有人能帮我找出问题吗？

将您的控制台移动到

subscribe（）

---

将您的控制台移动到

subscribe（）

---

您试图在订阅完成之前获取结果，请将其移动到订阅内部；如果要在视图中获取此数据，可以使用异步管道：

export class BusinessComponent implements OnInit {
 serviceSavings : Observable<Services[]>;

constructor(private ServicesService: ServicesService){}

ngOnInit(){
 this.serviceSavings = 
  this.ServicesService.getServicesByCatID(PRODUCTSAVINGSID); 
}

导出类BusinessComponent实现OnInit{
服务节约：可观察；
构造函数（私有服务服务：服务服务服务）{}
恩戈尼尼特（）{
此服务节省=
this.ServicesService.getServicesByCatID（PRODUCTSAVINGSID）；
}

您可以在视图中迭代数据：

<p *ngFor='let service of serviceSavings | async'></p> 

如果要在订阅完成之前获取结果，请将其移动到订阅中；如果要在视图中获取此数据，可以使用异步管道：

export class BusinessComponent implements OnInit {
 serviceSavings : Observable<Services[]>;

constructor(private ServicesService: ServicesService){}

ngOnInit(){
 this.serviceSavings = 
  this.ServicesService.getServicesByCatID(PRODUCTSAVINGSID); 
}

导出类BusinessComponent实现OnInit{
服务节约：可观察；
构造函数（私有服务服务：服务服务服务）{}
恩戈尼尼特（）{
此服务节省=
this.ServicesService.getServicesByCatID（PRODUCTSAVINGSID）；
}

您可以在视图中迭代数据：

<p *ngFor='let service of serviceSavings | async'></p> 

我也有同样的问题，我得出一个结论，应该写这篇文章

 this.ServicesService.getServicesByCatID(PRODUCTSAVINGSID)
 .subscribe(serviceSavings => this.serviceSavings = [...serviceSavings]);

---

与

this.serviceSavings=serviceSavings

不同，同样，每次希望向数组添加元素时，最好编写

this.serviceSavings=[…serviceSavings，newServiceSaving]

而不是

。推送（newServiceSaving）

我也有同样的问题，我得出结论，应该写这篇文章

 this.ServicesService.getServicesByCatID(PRODUCTSAVINGSID)
 .subscribe(serviceSavings => this.serviceSavings = [...serviceSavings]);

---

与

this.serviceSavings=serviceSavings

不同，同样，每次希望向数组添加元素时，最好编写

this.serviceSavings=[…serviceSavings，newServiceSaving]

而不是

。推送（newServiceSaving）

什么是

PRODUCTSAVINGSID

？如果你在chrome控制台中查看

network

，你真的能看到任何结果吗？你应该把你的console.log放在subscribeproductSavingsID的返回中，这是一个int值，我在这里没有提到，但我在代码中提到了。是的，我在chrome日志中检查了statements正在打印，但在初始化日志中为0always@HMarteau：这和我做的一样..什么是

PRODUCTSAVINGSID

？如果你查看chrome控制台中的

network

，你真的能看到任何结果吗？你应该把你的console.log放在subscribeproductSavingsID的返回中，它是一个int值我在这里没有提到，但我在代码中提到了。是的，我在chrome中检查了日志语句，但是在init log中它是0always@HMarteau当前位置与我所做的相同..我不知道这是怎么发生的，但我刚刚尝试..它正在打印..问题是我需要使用serviceSavings中的ID进行另一次restcall。它成为共犯如果我把它嵌套在这个..@ChandraMouli中，如果它没有打印出来，这意味着你永远不会从服务中回来。而且你不需要

.map（res=>res.json（））；

其他任何东西，而是写这个

this.servicesaviews=[…servicesaviews]

查看我的答案了解更多详细信息我不知道这是怎么发生的，但我刚刚尝试过..正在打印..问题是我需要使用serviceSavings中的ID进行另一次重新调用。如果我将其嵌套在其中，它会变得复杂..@ChandraMouli如果它未打印，则意味着您永远不会从服务中回来。您不需要

.map（res=>res.json（））；

更多信息，请编写此

this.servicesaviews=[…servicesaviews]

查看我的答案