嵌套NG-重複和推對象

Question

我已經寫消耗此JSON

{ 
    "savedBy": "1", 
    "symptom": "new", 
    "questionSet": [{ 
    "question": "This is question 1", 
    "options": [{ 
     "values": "okasdsad" 
     }, 
     { 
     "values": "asdsad", 
     "subQuestionSet": [{ 
      "question": "This is question 1", 
      "options": [{ 
       "values": "okasdsad" 
      }, 
      { 
       "values": "oaskdosakdo" 
      }, 
      { 
       "values": "yoyoyo" 
      }, 
      { 
       "values": "nonono" 
      } 
      ] 
     }] 
     }, 
     { 
     "values": "yoyoyo" 
     }, 
     { 
     "values": "nonono" 
     } 
    ] 
    }] 
} 

現在我已經寫在角前端，這樣我可以通過形式發送此JSON值的API，

HTML。

<div class="question" ng-repeat="qItem in questionVo track by $index"> 
    {{questionVo}} 
    <div class="col-md-12">QUS {{$index+1}} 
    <input type="text" ng-model="qItem.question" class="form-control" id=""></div> 
    {{question}} 
    <div class="form-inline col-md-10 col-md-offset-2"> 

    <div class="form-group" ng-repeat="items in optionsVo track by $index"> 
     {{optionsVo}} 
     <label>{{$index+1}}</label><input ng-model="items.values" type="text" class="form-control" id=""> 
     <i class="fa fa-plus-square" ng-click="addoptionsVo(items)"></i> 
     <i class="fa fa-minus-square" ng-click="optionsVo.splice($index, 1)"></i> 
     <button class="btn btn-primary" ng-click="showSubset()">Add Subset</button> 

     <!--------subset -----> 

     <div class="question" ng-if="showSubsetView == true" ng-repeat="SubqItem in ssss track by $index"> 
     <div class="col-md-12">QUS {{$index+1}} 
      <input type="text" ng-model="question" class="form-control" id=""></div> 
     <div class="form-inline col-md-10 col-md-offset-2"> 
      {{itemsz.ssss}} 

      <div class="form-group" data-ng-repeat="Subitems in optionsVo track by $index"> 
      <label>{{$index+1}}</label><input type="text" class="form-control" id=""> 
      <i class="fa fa-plus-square" ng-click="addoptionsVo($index)"></i> 
      <i class="fa fa-minus-square" ng-click="optionsVo.splice($index, 1)"></i> 
      <button class="btn btn-primary">Add Subset</button> 

      </div> 
      <div class="clearfix"></div> 

      <div class="btn-margin"><button class="btn btn-primary">Add More</button></div> 
     </div> 
     <div class="clearfix"></div> 
     </div> 

     <!--------subset -----> 

    </div> 

    <div class="clearfix"></div> 

    <div class="btn-margin"><button class="btn btn-primary">Add More</button></div> 
    </div> 
    <div class="clearfix"></div> 
</div> 

角JS

$scope.questionVo = [{ 
    question: '', 
}]; 

$scope.addquestionVo = function($event) { 
    $scope.questionVo.push({ 
    question: '', 
    }); 
}; 

$scope.optionsVo = [{}]; 

$scope.addoptionsVo = function($event) { 
    $scope.optionsVo.push({}); 
}; 

問題 1）當我在陣列中添加的第二個問題的選項保持相同像在第一問題 2.）我想使json與問題中的api json相同通過角度

也

"options": [{ 
    "values": "okasdsad" 
    }, 
    "subQuestionSet": [{ 
    "question": "This is question 1", 
    "options": [{ 
     "values": "okasdsad" 
     }, 
     { 
     "values": "oaskdosakdo" 
     }, 
     { 
     "values": "yoyoyo" 
     }, 
     { 
     "values": "nonono" 
     } 
    ] 
    }] { 
    "values": "okasdsad" 
    } 
] 

任何人都可以幫助我嗎？ 任何人>？

PLUNKERhttps://plnkr.co/edit/33mVEQ?p=preview

編輯：我發現了奇怪的問題與plunker /鍍鉻它給{[ "values": "asdsa"]]但plunker它正在成爲[{ "values": "asdsa" }]

Answer 1

找到符合您的要求下面的方法。 options應位於question陣列內。

'use strict'; 
 
var app = angular.module('medparser',[]); 
 

 

 

 
app.controller('addquestionController', function($scope, $http, $window, $rootScope, $timeout) { 
 

 

 

 
    $scope.addoptionsVo = function(no) { 
 

 
    $scope.questionVo[no].options.push({ 
 
     values: '' 
 
    }); 
 
    }; 
 

 
    $scope.questionVo = [{ 
 
    question: '', 
 
    options: [{ 
 
     "values": "" 
 
    }] 
 
    }]; 
 

 
    $scope.addquestionVo = function($event) { 
 
    console.log("ASDSA"); 
 
    $scope.questionVo.push({ 
 
     question: '', 
 
     options: [{ 
 
     "values": "" 
 
     }] 
 
    }); 
 
    }; 
 
    ////////////////////////////////////////////// 
 
    $scope.showSubsetView = false; 
 
    $scope.showSubset = function() { 
 
    $scope.showSubsetView = true; 
 
    }; 
 

 

 

 

 

 

 
}); 
 

 
////////////////////////////////////////

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<body ng-app="medparser" ng-controller="addquestionController"> 
 
    <div class="intro-header"> 
 
    <div style="height:1px"></div> 
 
    <nav class="navbar-default" role="navigation"> 
 
     <div class="container"> 
 
     <div class="navbar-header"> 
 
      <a class="navbar-brand" href="index1.html"> 
 
      <div class="logo"> 
 
       <img src="images/logo.png"></div> 
 
      </a> 
 
     </div> 
 

 
     <div class="header-text"> 
 
      Questionnaire For Doctors 
 
     </div> 
 
     </div> 
 
    </nav> 
 
    </div> 
 

 
    <div class="container header-padding"> 
 
    <div class="col-md-6">Symptoms</div><br> 
 
    <div class="col-md-6"><input type="text" ng-model="keyword" class="form-control" ng-keyup="searchsymptoms(keyword)" typeahead="state.name for state in symptomsList | filter:$viewValue | limitTo:8" id=""></div> 
 
    <div class="clearfix"></div> 
 
    question : {{questionVo}} 
 
    <div class="question" ng-repeat="qItem in questionVo track by $index"> 
 

 
     <div class="col-md-12">QUS {{$index+1}} 
 
     <input type="text" ng-model="qItem.question" class="form-control" id=""></div> 
 
     {{question}} 
 
     <div class="form-inline col-md-10 col-md-offset-2"> 
 

 

 
     <div class="form-group" ng-repeat="items in qItem.options track by $index"> 
 

 
      <label>{{$index+1}}</label><input ng-model="items.values" type="text" class="form-control" id=""> 
 
      <i class="fa fa-plus-square" ng-click="addoptionsVo(items)"></i> 
 
      <i class="fa fa-minus-square" ng-click="optionsVo.splice($index, 1)"></i> 
 
     </div> 
 
     <div class="clearfix"></div> 
 

 
     <div class="btn-margin"><button class="btn btn-primary" ng-click="addoptionsVo($index)">Add Option</button></div> 
 
     </div> 
 
     <div class="clearfix"></div> 
 
    </div> 
 
    <div class="pull-left header-padding"><button class="btn btn-primary" ng-click="addquestionVo($event)">Add Question</button></div> 
 
    <div class="pull-right header-padding"><button class="btn btn-primary">Save</button></div> 
 
    </div> 
 
</body>