javascript - Show ng-repeat selectively in AngularJs -

javascript - Show ng-repeat selectively in AngularJs -

i having info below. there 2 types of questions 1 have pictures reply , other has options answer.

$scope.data = [ {'question': "select one.", 'pic': false, 'answer': [ {"option": "8", "correct": false}, {"option": "14", "correct": false}, {"option": "1", "correct": true}, {"option": "23", "correct": false} ] }, {'question': "select right answer.", 'pic': true, 'answerpic': [ {"option": "img/pic1.jpeg", "correct": false}, {"option": "img/pic2.jpeg", "correct": false}, {"option": "img/pic3.jpeg", "correct": true}, {"option": "img/pic6.jpeg", "correct": false} ] }, ]

i have used below code nowadays them in view. can see there 2 block of ng-repeat, 1 each type. how create angular take particular type looking pic value in data? illustration if pic true angular should utilize block picture. , otherwise normal one.

<div class="text"> <label ng-repeat="a in question.answer"> <input type="radio" name="answers"> <div class="item-content"> {{ a.option }} </div> </label> </div> <div class="picture"> <label ng-repeat="a in question.answer"> <input type="radio" name="answers"> <div class="item-content"> <img src="{{ a.option }}" /> </div> </label> </div>

as of now, alternative can think of is, using ng-show , ng-hide. able pass pic value info it. looks hack me. best way solve kind of scenario?

you can utilize ng-if or ng-switch. in contrast ng-show/ng-hide, former remove elements dom, whereas latter changes display css property.

this page provides illustration.

javascript angularjs conditional angularjs-ng-repeat