2016-11-21 61 views
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

+0

一個單選按鈕的功能是隻允許一個選擇你要選擇一個以上的,你應該使用複選框 – GraveyardQueen

+0

一個時間。如果我知道,但有兩種面臨的問題廣播組請查看預覽鏈接 –

回答

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>

+0

謝謝你正在工作 –

+0

只是確保所有的id在你的json中是唯一的 – Dev

2

請更改代碼

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

有了這個

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

這將解決您的問題。問題是由於2個單選按鈕組的名稱相同。所以我改變了這一點,並給予動態。

+0

請使用name =「radio _ {{$ parent。$ index}}」來代替智能組合索引。 也編輯了我的答案。 –

相關問題