Angularjs Update-Bereich innerhalb der Iteration

Question

Im folgenden Code versuche ich, Teilfragen Liste für jede Frage zu bekommen und zeigen sie in der Ansicht, aber ich habe Probleme bei der Aktualisierung Teilfrage für jede Frage, es nicht aktualisieren, so dass ich gleich Unterfrage Liste für alle Fragen.

Wie kann ich jede Frage zeigen und alle Unterfrage darunter auflisten?

Answer 1

Sieht so aus, als ob es sich nicht um ein Problem handelt, das mit dem Winkelbereich zusammenhängt, es ist reiner JavaScript-Bereich, mit dem Sie Probleme haben. Wenn Sie asynchrone Aufrufe in der Schleife ausführen, erhalten Sie jedes Mal das letzte Element. Um es zu beheben, sollten Sie Versprechen innerhalb der Schleife mit anonymen Funktionen umhüllen.

prüfen dieses klassische Beispiel (Sie können denken, dass setTimeout-Funktion Ihres Question.questionsByQuestionGroup({id:group[i].id}).$promise äquivalent ist, sie beide Asynchron-Funktionen sind)

//THIS IS EQUIVALENT TO YOUR CASE 
 
//In this case it will return each time last element, 5 in this case 
 
for (var i = 0; i < 5; i++) { 
 
    setTimeout(function() { 
 
    console.log(i) 
 
    }); 
 
} 
 
//Result: 5 5 5 5 5 
 

 
//THIS IS HOW YOU SHOULD REFACTOR 
 
//Make a wrapper for async, and it will work as needed 
 
for (var j = 0; j < 5; j++) { 
 
    (function(index) { 
 
    setTimeout(function() { 
 
     console.log(index) 
 
    }); 
 
    })(j); 
 
} 
 
//Result: 0 1 2 3 4

P. S. Nachdem Sie es mit Wrappern behoben haben, wird Ihr Code noch unlesbarer sein, besser um ihn in separate Funktionen umzuwandeln.

Answer 2

Einzelne Fragen müssen geschoben zu einer Fragenliste sein. Erstellen Sie eine Unterfrage Liste für jede individuelle Frage. Einzelne Teilfragen müssen geschoben zu ihren jeweiligen Listen sein.

function loadAllQuestionGroup() { 
    Questiongroup.query({}).$promise.then(function(group){ 
     vm.questiongroups = group; 
     //Initialize question list 
     vm.questionList = []; 
     for (var i=0;i<group.length;i++){ 
      var grouptitle=group[i].title; 
      Question 
       .questionsByQuestionGroup({id:group[i].id}) 
       .$promise 
       .then(function(question){ 
       //Push question to list 
       vm.questionList.push(question); 
       for (var j=0;j<question.length;j++) { 
        //Initialize subquestion list 
        question.subquestionList = []; 
        Subquestion 
         .subquestionsByQuestion({id:question[j].id}) 
         .$promise 
         .then(function(subquestion){ 
          //Push subquestion to list 
          question.subquestionList.push(subquestion); 
         }) 
        ;       
       }; 
       }) 
      ; 
     } 
    }); 
} 

Teilfrage interation (ng-repeat) sollte auf dem question Iterator erfolgen.

<div ng-repeat="question in vm.questionList"> 
    {{question.name}} 
    <div ng-repeat="subquestion in question.subquestionList"> 
    {{subquestion.name}} 
    </div> 
</div> 

Beachten Sie, dass eine subquestionList Eigenschaft wurde jedequestion im questionList zu hinzugefügt.