0

不确定我是否正确地问了这个问题，但我有一项服务用于在不同组件之间共享数组对象。但是，当我将新对象提交给服务时，有些东西正在更新我的服务数组中的所有其他对象。

即第一次推送答案 = [{questionId: 1, value: 1}] 第二次推送 {questionId: 1, value: 3} answers = [{questionId: 1, value: 3}, {questionId: 1, value: 3} ]

请注意值如何更改以匹配新推送的答案对象的值。

这是我的服务

export interface Answer {
  questionId: number;
  value: number;
}

  private answers: Answer[] = [];
  private _answers: BehaviorSubject<Answer[]> = new BehaviorSubject([]);
  public answers$ = this._answers.asObservable();


  addAnswer(answer: Answer) {
    this.answers.push(answer);
    this._answers.next(this.answers);
  }

这是我的组件

export class LevelComponent {
  subscription: Subscription;
  answer: Answer = {questionId: 0, value: 0}; 
  a: Answer[];
  constructor(public route: ActivatedRoute, public answerService: AnswerService) {

  }

  ngOnInit() {

    this.subscription = this.answerService.answers$.subscribe(item => this.a = item);


  }
  ngOnDestroy() {
    // prevent memory leak when component is destroyed
    this.subscription.unsubscribe();
  }


  submitAnswer(e){
    console.log(e.target.id);
    this.answer.questionId = 1;
    this.answer.value = e.target.id;

    this.answerService.addAnswer(this.answer);
  }

基本上，我希望跨多个组件“共享”一系列答案，但对 BehaviorSubject 和订阅的有限理解令人困惑，为什么在向服务中的数组添加新项目后，它会更新所有其他对象。附带说明一下，如果我将答案 var 更改为只是一个数字，那么当我提交答案时，数组中的值不会改变。

这是一个Plunker，它说明了我所看到的。

4

2 回答 2

0

感谢那些看过我的问题的人。

因此，事实证明我的服务是正确的并且按预期运行。问题是我每次都将我的答案的相同引用传递给 addAnswer 调用，因此它正在更新引用的答案，这反过来又更新了数组中的每个对象。

解决方法是在每次提交之前声明一个新答案。

  submitAnswer(e){
    let answer: Answer = {questionId: 1, value: e.target.id};
    this.answerService.addAnswer(answer);
  }
于 2016-12-08T18:10:00.570 回答
0

可能是因为你这样做：

this.answers.push(answer);
this._answers.next(this.answers);

当你只需要这样做时

this._answers.next(answer);

IE 通过使用整个数组调用 next，您的订阅者将收到整个数组作为下一项，而不仅仅是下一项。

于 2016-12-08T01:31:26.853 回答