For循环无法正常工作（Angular2）

Question

我想知道为什么我会在Angular2 (TypeScript)中使用For循环得到奇怪的行为。我做了这个循环

loadAllQuestions() { 

      this.questionService.loadAllQuestions() 
       .map(res=>res.json()) 
       .subscribe(res=>{ 
        this.listQuestion = res.questions; 
        for (var q in this.listQuestion){ 
         this.propositionService.findPropositionByQuestion(this.listQuestion[q].wordingQ) 
          .map(res=>res.json()) 
          .subscribe(res=>{ 
           console.log(this.listQuestion[q]); 
          }); 
        } 
      }); 
    } 

所以，每Question（在listQuestion）我叫使用它的措辞（wordingQ）服务将找到这个问题的所有命题（findPropositionByQuestion）;问题是，它似乎循环不工作，当使console.log(this.listQuestion[q])它只展示listQuestion中的最后一个问题与listQuestion中索引的数目一样多（所以如果我有3个问题，它显示我最后一个问题3次等等。）。 详细阐释：在这里，我有2个问题加载：

这里什么的console.log是我展示：

任何帮助吗？

Answer 1

你需要一个额外的方法来分割你的代码：

loadAllQuestions() { 
    this.questionService.loadAllQuestions() 
    .map(res => res.json()) 
    .subscribe(res => { 
     this.listQuestion = res.questions; 
     for (var q in this.listQuestion) { 
     this.findProposition(this.listQuestion[q]); 
     } 
    }; 
} 

findProposition(question) {       
    this.propositionService.findPropositionByQuestion(
    question.wordingQ) 
     .map(res => res.json()) 
     .subscribe(res => { 
     console.log(question); 
     console.log(res); 
     }); 
} 

这个问题可以帮助你理解为什么你有几次跟踪显示相同的元素：

• JavaScript closure inside loops – simple practical example

Answer 2

我建议你试试for (var q of this.listQuestion){...}而不是for (var q in this.listQuestion){...}

Answer 3

您可以使用let关键字使q变量块作用域。

for (let q in this.listQuestion){ //var --> let 
    this.propositionService 
     .findPropositionByQuestion(this.listQuestion[q].wordingQ) 
     .map(res=>res.json()) 
     .subscribe(res=>{ 
      console.log(this.listQuestion[q]); 
     }); 
}