Question

当前代码：我已在搜索页面中使用以下功能将数据成功存储到服务中。 this.userService.saveLocationData(this.locationType);及以下代码位于我的服务页面中。

saveLocationData(data:any){
      this.locationdata = data;
      console.log(this.locationdata);

  }

成功导航到用户页面后，我没有在我的用户组件中获取位置数据。我在我的用户组件和构造函数中使用了以下代码。

this.locationData = this.userService.retrieveLocationData();

我在下面的服务页面中使用了检索功能

retrieveLocationData(){
    console.log(this.locationdata);
      return this.locationdata;
  }

问题：我无法在我的用户组件中获取位置数据。但我已使用saveLocationData函数保存在服务中。我已附加屏幕截图表示导航，在转到用户组件之前我已保存位置详细信息。我已经检查了控制台，我得到了。但在我的用户组件中，我没有得到位置的详细信息。

Answer 1

您正在将引用保存到对象，并且可能在路由更改期间正在修改该对象。因此，当您从服务中获取引用时，它只会产生更改方式。

尝试制作该物品的副本。

saveLocationData(data:any){
   this.locationdata= Object.assign({}, data);
   console.log(this.locationdata);
}

如果您的对象包含深层引用。您需要制作一份深层副本。可以这样做，但你会松开任何方法。

saveLocationData(data:any){
   this.locationdata= JSON.parse(JSON.stringify(data));;
   console.log(this.locationdata);
}

当路由加载延迟模块时，服务可能会重复。

我没有测试过这个技巧，但也许你可以通过服务构造函数来捕获重复项。

@Injectable()
export class MyService
     public constructor(@Optional() @SkipSelf() previousService: MyService) {
           if(previousService) {
                throw new Error('Service already loaded.');
           }
     }
}

无法使用角度2

1 个答案: