Javascript Angular FormGroup.value将值放入数组中

我正在使用创建一个简单的真/假测试。在测试结束时，点击submit按钮，调用一个服务，收集用户答案并存储它们

我的应用程序的结构如下所示：

这很简单。下面是使用“答案”服务的问题步进器的typescript代码

  //Push results to service so other components can use it
  gatherResults(){
    this._answerService.setAnswers(
                          Object.values(this.firstFormGroup.value),
                          Object.values(this.secondFormGroup.value), 
                          Object.values(this.thirdFormGroup.value),
                          Object.values(this.fourthFormGroup.value),
                          Object.values(this.fifthFormGroup.value),
                          Object.values(this.sixthFormGroup.value),
                          Object.values(this.seventhFormGroup.value),
                          Object.values(this.eigthFormGroup.value),
                          Object.values(this.ninthFormGroup.value),
                          Object.values(this.tenthFormGroup.value),
                          Object.values(this.eleventhFormGroup.value),
                          Object.values(this.twelthFormGroup.value)
                          );
    let answers = this._answerService.retrieveAnswers();
    console.log(answers);
  }

export class AnswersService {

  answers = {};
  constructor() { }

  setAnswers(a1, a2, a3, a4, a5, a6, a7, a8, a9, a10, a11, a12){
    this.answers = {
      answer1 : a1,
      answer2: a2,
      answer3: a3,
      answer4: a4,
      answer5: a5,
      answer6: a6,
      answer7: a7,
      answer8: a8,
      answer9: a9,
      answer10: a10,
      answer11: a11,
      answer12: a12
    }
  }

  retrieveAnswers(){
    return this.answers;
  }

}

这是“答案”服务的完整代码

  //Push results to service so other components can use it
  gatherResults(){
    this._answerService.setAnswers(
                          Object.values(this.firstFormGroup.value),
                          Object.values(this.secondFormGroup.value), 
                          Object.values(this.thirdFormGroup.value),
                          Object.values(this.fourthFormGroup.value),
                          Object.values(this.fifthFormGroup.value),
                          Object.values(this.sixthFormGroup.value),
                          Object.values(this.seventhFormGroup.value),
                          Object.values(this.eigthFormGroup.value),
                          Object.values(this.ninthFormGroup.value),
                          Object.values(this.tenthFormGroup.value),
                          Object.values(this.eleventhFormGroup.value),
                          Object.values(this.twelthFormGroup.value)
                          );
    let answers = this._answerService.retrieveAnswers();
    console.log(answers);
  }

export class AnswersService {

  answers = {};
  constructor() { }

  setAnswers(a1, a2, a3, a4, a5, a6, a7, a8, a9, a10, a11, a12){
    this.answers = {
      answer1 : a1,
      answer2: a2,
      answer3: a3,
      answer4: a4,
      answer5: a5,
      answer6: a6,
      answer7: a7,
      answer8: a8,
      answer9: a9,
      answer10: a10,
      answer11: a11,
      answer12: a12
    }
  }

  retrieveAnswers(){
    return this.answers;
  }

}

所有这些代码都可以工作，但是，我有一个小问题。应答对象存在的格式。当我在answers服务中记录answers对象时，它返回一个包含数组的对象

我能把它改成像这样的物体吗

编辑

我尝试在answers服务中调用setAnswers函数时删除Object.Values。这只是在值中给了我另一个对象。这是从前两个中删除它时得到的结果

对象。值（对象）将对象转换为数组，因此如果只需要第一个值，则可以尝试此操作

  //Push results to service so other components can use it
  gatherResults(){
    this._answerService.setAnswers(
                          Object.values(this.firstFormGroup.value)[0],
                          Object.values(this.secondFormGroup.value)[0], 
                          Object.values(this.thirdFormGroup.value)[0],
                          Object.values(this.fourthFormGroup.value)[0],
                          Object.values(this.fifthFormGroup.value)[0],
                          Object.values(this.sixthFormGroup.value)[0],
                          Object.values(this.seventhFormGroup.value)[0],
                          Object.values(this.eigthFormGroup.value)[0],
                          Object.values(this.ninthFormGroup.value)[0],
                          Object.values(this.tenthFormGroup.value)[0],
                          Object.values(this.eleventhFormGroup.value)[0],
                          Object.values(this.twelthFormGroup.value)[0]
                          );
    let answers = this._answerService.retrieveAnswers();
    console.log(answers);
  }

如果要按名称命名所有值，可以尝试以下方法：

//Push results to service so other components can use it
gatherResults(){
this._answerService.setAnswers(
                              this.firstFormGroup.value.firstCtrl,
                              this.secondFormGroup.value.secondCtrl, 
                              ..
                              //And similarly for all forms
                              );
let answers = this._answerService.retrieveAnswers();
console.log(answers);

---

我以前尝试过这个，它在值中创建了另一个对象。我将用截图更新我的答案，截图显示从前两个表单组中删除Object.values时得到的结果。这会有所帮助，this.firstFormGroup.value会返回什么？这正是我所需要的。非常感谢。您也可以尝试我建议的替代方法。如果您可以用相同的名称命名所有控件会更好。它将帮助您编写代码。