ラジオボタンをクリックしてラジオボタンをクリックした後に削除する

Question

ラジオのグループを2つクリックするとイオンラジカルが発生します。ラジオグループを1つクリックすると選択された回答が保存されました。最初に選択したラジオが削除されました

<div ng-app="ionicApp" ng-controller="HomeCtrl" style="padding:25px"> 
{{question | json }} 
<div ng-repeat="q in question" > 

       <div class="list"> 

        <div class="item item-divider"> 
         {{q.question}} 
        </div> 
        <ion-radio ng-repeat="option in q.options" ng-value="option" ng-model="q.answer" > 
         {{ option }} 
        </ion-radio> 

        <br> 

       </div> 
      </div> 

angular.module('ionicApp', ['ionic']) 

.controller('HomeCtrl', function($scope) { 
    $scope.question = 
[ 
    { 
    "is_radio": true, 
    "question": "Roughly how much of your profile was spent on digital activities in your last job?", 
    "options": ["Less than 10%","Less than 25%","Less than 50%","More than 50%"], 
    "id": "130", 
    "answer": "" 
    }, 
    { 
    "is_radio": true, 
    "question": "Have you spent more time with B2B or B2C?", 
    "options": ["B2C","Both","Less than 10%"], 
    "id": "130", 
    "answer": "" 
    } 
] 

}) 

Here is preview | jsfiddle

Answer 1

angular.module('ionicApp', ['ionic']) 
 

 
.controller('HomeCtrl', function($scope) { 
 
    $scope.question = 
 
[ 
 
    { 
 
    "is_radio": true, 
 
    "question": "Roughly how much of your profile was spent on digital activities in your last job?", 
 
    "options": ["Less than 10%","Less than 25%","Less than 50%","More than 50%"], 
 
    "id": "129", 
 
    "answer": "" 
 
    }, 
 
    { 
 
    "is_radio": true, 
 
    "question": "Have you spent more time with B2B or B2C?", 
 
    "options": ["B2C","Both","Less than 10%"], 
 
    "id": "130", 
 
    "answer": "" 
 
    } 
 
] 
 
\t \t \t \t 
 
})

<link href="http://code.ionicframework.com/1.0.0-beta.14/css/ionic.css" rel="stylesheet"/> 
 
<script src="http://code.ionicframework.com/1.0.0-beta.14/js/ionic.bundle.js"></script> 
 
<div ng-app="ionicApp" ng-controller="HomeCtrl" style="padding:25px"> 
 
{{question | json }} 
 

 
    <div ng-repeat="q in question" > 
 

 
\t \t \t \t \t <div class="list"> 
 

 
\t \t \t \t \t \t <div class="item item-divider"> 
 
\t \t \t \t \t \t \t {{q.question}} 
 
\t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t <ion-radio name="{{q.id}}" ng-repeat="option in q.options" ng-value="option" ng-model="q.answer" > 
 
\t \t \t \t \t \t \t {{ option }} 
 
\t \t \t \t \t \t </ion-radio> 
 

 
\t \t \t \t \t \t <br> 
 

 
\t \t \t \t \t </div> 
 
\t \t \t \t </div> 
 
</div>

Answer 2

コード

の次の行を変更してください。この

<ion-radio ng-repeat="option in q.options" ng-value="option" ng-model="q.answer" name="radio_{{$parent.$index}}" > 

で

<ion-radio ng-repeat="option in q.options" ng-value="option" ng-model="q.answer"> 

これはあなたの問題を解決します。問題は2つのラジオボタングループに与えられた同じ名前に起因する。だから私はそれを変え、動的に与えました。