Question

我编写了一个使用此JSON的API

{
  "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值，

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>

Angular 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"
  }
]

任何人都可以帮我这个吗？任何人＆GT;

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

编辑：我发现使用plunker / in chrome的奇怪问题是{[ "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>

嵌套的ng-repeat和push对象

1 个答案: