check if items inside ng-repeat already contains value

Question

I have JSON string of question and answer which binds in ng-repeat , now problem is i wants to show question once and all multiple answer within ng-repeat . this are my data.

{Answer:"White",AnswerID:967,answer_type:"RADIO",fullquestion:"Your Race",id:6}{Answer:"African American",AnswerID:968,answer_type:"RADIO",fullquestion:"Your Race",id:6}{Answer:"Asian",AnswerID:969,answer_type:"RADIO",fullquestion:"Your Race",id:6}

view i am showing in

 <div ng-repeat="hrq in HrqQuestions">
            <div class="list card normal">
                <div class="item item-body item-divider">                    
                    <p ng-bind="hrq.fullquestion"></p>                       
                </div>
                <label class="item item-input" ng-show="hrq.answer_type=='FREETEXT'">
                    <input ng-model="hrq.Answer" name="name" type="text">
                </label>
                <div ng-if="hrq.answer_type=='RADIO'">
                    <ion-radio ng-click="selectedAnswer(hrq.AnswerID,hrq.Answer)" name="radio1" ng-value="hrq.AnswerID">{{hrq.Answer}}</ion-radio>
                </div>
            </div>
        </div>

but this binds all questions multiple times with answer like

     Q.Your Race
           White Your Race
     Q.Your Race
           African American Your Race
     Q.Your Race
           Asian

but i need like

     Q. Your Race
           White Your Race
           African American Your Race
           Asian

i will be very thankful if anyone can help me with this

one idea would be to transform HrqQuestions object in to the format you want. — Ruhul, Aug 19 '16 at 10:21

Devidas Kadam · Answer 1 · 2016-08-19T11:38:26.423

Try like this fiddle

    <div ng-controller="MyCtrl">      
  <div ng-repeat="hrq in HrqQuestions">
            <div class="list card normal">
                <div class="item item-body item-divider">                    
                  <p>{{$index + 1}}. {{hrq.fullquestion}}</p>              
                </div>
                <div ng-repeat="answer in hrq.answers">
                  <label class="item item-input" ng-show="answer.answer_type=='FREETEXT'">
                    <input ng-model="answer.Answer" name="name" type="text">
                </label>
                <div ng-if="answer.answer_type=='RADIO'">
                    <input type="radio" ng-click="selectedAnswer(answer.AnswerID,answer.Answer)" name="radio1" ng-value="answer.AnswerID">{{answer.Answer}} 
                </div>
                </div>
                <br>
            </div>
        </div>
</div>

controller code

    $scope.HrqQuestions = [{ fullquestion: "Your Race", id: 6,
                         answers: [{ Answer: "White", AnswerID: 967, answer_type: "RADIO" },
                                   { Answer: "African American", AnswerID: 968, answer_type: "RADIO" },
                                   { Answer: "Asian", AnswerID: 969, answer_type: "RADIO" }] }, 
                        { fullquestion: "My Race", id: 7, 
                          answers: [{ Answer: "Black", AnswerID: 967, answer_type: "RADIO" },
                                    { Answer: "African Indian", AnswerID: 968, answer_type: "RADIO" },
                                    { Answer: "India", AnswerID: 969, answer_type: "RADIO" }] }];

more than one questions are there in JSON string so i have to use it inside ng-repeat to show all question, i cant show them individually. — Vikas Vanvi, Aug 19 '16 at 11:09
I have updated the answer, you need to change JSON structure, Keep the question and answers in an object. see the updated answer and fiddle — Devidas Kadam, Aug 19 '16 at 11:28
thanks for reply . tbh, i was looking for something to change within ng-repeat by giving some filter or where condition , my first priority was to change JSON format but i have to code too much for changing JSON. — Vikas Vanvi, Aug 19 '16 at 12:20
you can easily change the format of JSON as we want in angularJS, no need to change your backend. — Devidas Kadam, Aug 19 '16 at 12:41
changing from mine json format to ur provided json format dont you think it will require many loops , in my case it does , i have never done in angular js btw so have no idea how easy it will be in angular js,if you can share any example it would be great help — Vikas Vanvi, Aug 19 '16 at 13:23

Maniarasu V · Accepted Answer · 2016-08-19T13:48:45.757

Try this,

Change your 'HrqQuestions' as array
Group your questions using 'id'
And repeat values of grouped questions. Like this,

angular.module('app',['angular.filter']).controller('MainController', function($scope) {
  $scope.HrqQuestions = [
      {Answer:"White",AnswerID:967,answer_type:"RADIO",fullquestion:"Your Race",id:6},
      {Answer:"African American",AnswerID:968,answer_type:"RADIO",fullquestion:"Your Race",id:6},
      {Answer:"Asian",AnswerID:969,answer_type:"RADIO",fullquestion:"Your Race",id:6}
    ];
 });

<!DOCTYPE html>
<html ng-app="app">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
  <script src="//cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.4/angular-filter.js"></script>

<body ng-controller="MainController">
  <div ng-repeat="(key, value) in HrqQuestions | groupBy: 'id'">
    <div><strong>Id:</strong> {{ key }}</div>
     <p ng-repeat="v in value">
       <strong>Answer {{ $index + 1}}</strong>. {{ v.Answer }}
     </p>
  </div>
</body>
</html>

Awesome , thank you very much this what i was looking for :) — Vikas Vanvi, Aug 19 '16 at 14:18

check if items inside ng-repeat already contains value

2 Answers2