以角度js动态更改标签名称从角度控制器获取值

Question

  

嗨朋友们，我正在尝试设计安全问题窗口   有三个问题，但在同一个窗口依赖一个接一个   点击按钮。在我的例子中，我点击后确认按钮   它会将答案和问题ID发送给后端弹簧控制器。如果   答案是不正确的，然后我必须显示下一个问题   窗口和3个问题一样明智。我接下来无法展示   问题。我的代码listOfUserQuesValues []中有两个数组用于安全性    question和listOfUserQuesKey []包含该问题的关键字。它们包含3个值。

     

Security_Question.jsp

<script type="text/javascript"> 

     

var app = angular.module（＆＃39; formSubmit＆＃39; []）;   app.controller（＆＃39; forgotController＆＃39 ;,   [＆＃39; $ scope＆＃39;，＆＃39; $ http＆＃39;，＆＃39; $ location＆＃39;，功能（$ scope，$ http，$ location）               {               $ scope.Id = 0;               $ scope.listOfUserQuesValues = [];               $ scope.listOfUserQuesKey = [];

       //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;                                       

$ http.get（＆＃39;的LoginController / getUserQuestions /＆＃39 +用户id）.success（功能（数据，

  

status，headers，config）{
                                  angular.forEach（数据，函数（价值，键）{                                 $ scope.listOfUserQuesKey.push（键）;                                 $ scope.listOfUserQuesValues.push（值）;

                          })

                      })
                      .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? "; 

           }

      } ]);

     

     

security_Question.jsp的Html代码           

  <div class="row" style="margin-top: 20px"
      data-ng-init="getUserQuestions()">          <div
          class="col-xs-12 col-sm-8 col-md-6 col-sm-offset-2 col-md-offset-3">
          <form role="form" name="myform">
              <fieldset>
                  <h3>Password Recovery Security Question</h3>
                  <hr class="colorgraph">


                  <div id="myModal" class="modal fade">
                      <div class="modal-dialog">
                          <div class="modal-content">
                              <div class="modal-header">
                                  <button type="button" class="close" data-dismiss="modal"
                                      aria-hidden="true">×</button>
                                  <h2 class="modal-title">Security Question</h2>
                                  <hr class="colorgraph">

                                  <div class="form-group">

                                      <table>

                                              <tr>
                                              <td><label for="question">Security Question :
                                              </label></td>
                                              <td colspan="1"><label id="question" data-ng-model ="question">{{listOfUserQuesValues[0]}}
                                              </label>
                                              </td>
                                          </tr>
                                          <tr>
                                              <td><label for="ans">Answer : </label></td>
                                              <td colspan="1"><input type="text"
                                                  data-ng-model="answer" /></td>
                                          </tr>




                                      </table>
                                      <div class="form-group" style="padding: 20px 50px">
                                          <input type="button" class="button" value=" Confrim"  data-ng-click="checkAnswer(answer)">
                                          <input type="submit"  class="button" value=" Cancel" data-ng-click="cancel()">
                                      </div>
                                  </div>



                              </div>
                              <div class="modal-body"></div>
                          </div>
                      </div>
              </fieldset>
          </form>             </div>      </div>