Question

我了解默认情况下，角度服务是单例的。我有一个带有卡片的事件页面，当我单击“赞”按钮时，事件组件调用服务（称为userService），该服务将事件添加到阵列中，然后控制台记录该阵列，以便我进行验证。一切正常，但是当我离开事件页面并返回（使用路由器）时，阵列再次为空。我在文档中读了一些有关服务单例的信息，但似乎无法掌握解决方案或问题。

//this is the user.service.ts
@Injectable({
  providedIn: 'root'
})
export class UserService {
  userModel: UserModel;

  constructor() { 
    this.userModel= new UserModel();
  }
  //adding liked to an arary.
  likedEvents(event: EventModel){
    this.userModel.likedevent.push(event);
    console.log(this.userModel.likedevent);
  }
}

这就是我打电话的地方

//this is event.component.ts
constructor(private userService:UserService, ) { }
  like(){
    alert('hi');
    this.event.title ='event Title';
    this.event.location ='event location';
    this.event.etablissement = 'event etablissemetn'
    this.event.type = 'happy hour'
    console.log(this.event);

    //here i call the service
    this.userService.likedEvents(this.event);
    this.userService.saveLikedEvents();
  }

我不明白的是为什么该服务具有多个实例，其次我如何将其简化为一个实例，我已经阅读了文档，但是由于我是angel的新手，所以我不太了解。

更新：在我使用href的导航栏中，我切换到routerlink，问题已解决。但是，刷新页面时仍然是同样的问题。

Answer 1

如果我正确理解您想存储数组的状态，那么为什么不只使用“存储”呢？我相信NGRX可以满足您的需求！

该服务运行正常。当离开组件时，所有变量都不再可用，存储所做的就是在其他位置复制一个副本，以便在重新加载页面时可以获取先前的状态。

Answer 2

问题出在我使用href的导航栏上。我通过切换到routerlink来解决了问题

角服务，有多个实例而不是单例吗？

2 个答案: