使用AngularJS和Ionic取消選擇單選按鈕

Question

我使用Ionic和AngularJS 1.x創建一個Survey應用程序，當用戶提交表單時，我試圖發送正確的數據。

當一個問題有一組單選按鈕（答案）時，當用戶點擊其中一個按鈕時（按預期），我的應用程序將答案標記爲「已選中」，但如果用戶點擊另一個選項，則前一個選項保持標記作爲「選定」。所以，當提交數據時，我會在「單選按鈕問題」中收到多個答案。

Here´s my code in codepen

我認爲我設定的單選按鈕錯誤，here's的代碼，它的提取物：

<ion-radio name="{{q.question}}" 
       ng-if="q.is_simple == 1" 
       ng-repeat="a in q.answers" 
       ng-model="a.selected" 
       value="true"> 
     {{a.answer}}</ion-radio> 

然後，如果用戶用單選按鈕播放和命中2其中，兩個選項均被標記爲「已選」。

"answers": [ 
    { 
     "id": "5", 
     "question_id": "2", 
     "answer": "Yes", 
     "selected": "true", 
    }, 
    { 
     "id": "6", 
     "question_id": "2", 
     "answer": "No", 
     "selected": "true", 
    } 

你能幫我弄清楚這個嗎？我不知道我做錯了什麼。您可以看到複選框問題運行良好，但不是單選按鈕。

非常感謝您提前。我會很感激你能給我的任何幫助。

Answer 1

這不是一個單選按鈕在angularjs中的工作方式。

每個單選按鈕必須具有相同的模型。然後這個值將被選中。

<ion-radio name="{{q.question}}" 
      ng-if="q.is_simple == 1" 
      ng-repeat="a in q.answers" 
      ng-model="mymodel.thisanswer" 
      ng-value="{{a.id}}"> 
    {{a.answer}} 
</ion-radio> 

編輯根據你想要的東西，這可能是店q.selectedAnswer。像這樣，您將在所選答案的問題中擁有一個屬性。 {{a.answer}}