title: Change the label name dynamically in angular js getting value from angular controller
body: <blockquote>
    <p>Hi friends , I am trying to design security question window which will
    have 3 question but one after another on the same window depending
    upon the button click. In my example I have confirm button after click
    it will send answer and question id to back end spring controller. If
    answer is not correct then I have to display next question on the same
    window and like wise for 3 questions.And I am not able to show next
    question.There are two arrays in my code listOfUserQuesValues[] for security
     question and listOfUserQuesKey[] contains key of that question.Both contains 3 values.</p>
    
    <p>Security_Question.jsp</p>
  
  <pre><code>&lt;script type="text/javascript"&gt; 
  </code></pre>
    
    <p>var app = angular.module('formSubmit'[]);
    app.controller('forgotController',
    ['$scope','$http','$location',function($scope, $http,$location) 
                {
                $scope.Id=0;
                $scope.listOfUserQuesValues=[];
                $scope.listOfUserQuesKey=[];</p>
  
  <pre><code>       //gets the  user question by matching user id
          $scope.getUserQuestions=function()
          {
           var url = $location.search(); //read id from url
           angular.forEach(url,function(value,key)
                 {
                 $scope.Id=parseInt(value); //cuurent id
               })
                 var userId=$scope.Id;                                       
  </code></pre>
  </blockquote>
  
  <p>$http.get('loginController/getUserQuestions/'+userId).success(function(data,</p>
  
  <blockquote>
    <p>status, headers, config) {<br>
                                    angular.forEach(data,function(value,key){
                                  $scope.listOfUserQuesKey.push(key);
                                  $scope.listOfUserQuesValues.push(value);</p>
  
  <pre><code>                          })
  
                        })
                        .error(function(data, status, headers, config) {
                            alert( "Exception details: " +data+"  "+status);
                        }); 
              }//getUserQuestions
  
  
              //checkj for valid answer
             $scope.checkAnswer=function(answer)
             {
                var ans= {
                            "answer" :answer,
                          "security_question_id":$scope.listOfUserQuesKey[0]
                          //here assigning question Id of first question bt             this should be dynamically pass 1st then 2 then 3rd
                             };
  
                    var response = $http.post('loginController/checkAnswer',ans);
                response.success(function(data, status, headers, config) {
                                if(data=true)
                      window.alert("Password has been sent to your mail id successfullly ! ")                       else
      // here its has to get same window but with next question                         
                    });
                    response.error(function(data, status, headers, config) {
                        alert( "Exception details: " +data+"  "+status);
                    });
  
             }
  
              //cancel
             $scope.cancel=function()
             {
  
                  window.alert("cancel");
                 $("#myModal").modal('hide');
                    window.location="./forgotpassword.jsp? "; 
  
             }
  
        } ]);
  </code></pre>
    
    <p></p>
    
    <p>Html code of security_Question.jsp
            </p>
  
  <pre><code>  &lt;div class="row" style="margin-top: 20px"
        data-ng-init="getUserQuestions()"&gt;          &lt;div
            class="col-xs-12 col-sm-8 col-md-6 col-sm-offset-2 col-md-offset-3"&gt;
            &lt;form role="form" name="myform"&gt;
                &lt;fieldset&gt;
                    &lt;h3&gt;Password Recovery Security Question&lt;/h3&gt;
                    &lt;hr class="colorgraph"&gt;
  
  
                    &lt;div id="myModal" class="modal fade"&gt;
                        &lt;div class="modal-dialog"&gt;
                            &lt;div class="modal-content"&gt;
                                &lt;div class="modal-header"&gt;
                                    &lt;button type="button" class="close" data-dismiss="modal"
                                        aria-hidden="true"&gt;×&lt;/button&gt;
                                    &lt;h2 class="modal-title"&gt;Security Question&lt;/h2&gt;
                                    &lt;hr class="colorgraph"&gt;
  
                                    &lt;div class="form-group"&gt;
  
                                        &lt;table&gt;
  
                                                &lt;tr&gt;
                                                &lt;td&gt;&lt;label for="question"&gt;Security Question :
                                                &lt;/label&gt;&lt;/td&gt;
                                                &lt;td colspan="1"&gt;&lt;label id="question" data-ng-model ="question"&gt;{{listOfUserQuesValues[0]}}
                                                &lt;/label&gt;
                                                &lt;/td&gt;
                                            &lt;/tr&gt;
                                            &lt;tr&gt;
                                                &lt;td&gt;&lt;label for="ans"&gt;Answer : &lt;/label&gt;&lt;/td&gt;
                                                &lt;td colspan="1"&gt;&lt;input type="text"
                                                    data-ng-model="answer" /&gt;&lt;/td&gt;
                                            &lt;/tr&gt;
  
  
  
  
                                        &lt;/table&gt;
                                        &lt;div class="form-group" style="padding: 20px 50px"&gt;
                                            &lt;input type="button" class="button" value=" Confrim"  data-ng-click="checkAnswer(answer)"&gt;
                                            &lt;input type="submit"  class="button" value=" Cancel" data-ng-click="cancel()"&gt;
                                        &lt;/div&gt;
                                    &lt;/div&gt;
  
  
  
                                &lt;/div&gt;
                                &lt;div class="modal-body"&gt;&lt;/div&gt;
                            &lt;/div&gt;
                        &lt;/div&gt;
                &lt;/fieldset&gt;
            &lt;/form&gt;             &lt;/div&gt;      &lt;/div&gt;
  </code></pre>
    
    <p> </p>
  </blockquote>