2015-09-22 3 views
0

Я использую Ionic, и мне трудно найти выбранные переключатели.Ионный/Угловой выбор выбранной радиостанции в списке

Ниже мой HTML

<div class="list"> 
    <label class="item item-radio"> 
    <input type="radio" name="group" ng-model="answer"> 
     <div class="item-content"> 
     Canada 
     </div> 
    <i class="radio-icon ion-checkmark"></i> 
    </label> 
    <label class="item item-radio"> 
    <input type="radio" name="group" ng-model="answer"> 
     <div class="item-content"> 
     Africa 
     </div> 
    <i class="radio-icon ion-checkmark"></i> 
    </label> 
    <label class="item item-radio"> 
    <input type="radio" name="group" ng-model="answer"> 
     <div class="item-content"> 
     North America 
     </div> 
    <i class="radio-icon ion-checkmark"></i> 
    </label> 
</div> 

Любые предложения о том, как подойти к этой проблеме? Есть ли способ получить доступ к объекту модели из $ scope после выбора ответа?

ответ

3

У вас нет атрибута значения для ваших переключателей. Установите значение для радио-кнопки, и вы можете получить доступ к значению, используя $scope.answer

<!DOCTYPE html> 
 
<html ng-app> 
 
    <head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> 
 
    <link href="https://code.ionicframework.com/1.0.0/css/ionic.min.css" rel="stylesheet"> 
 
    <script src="https://code.ionicframework.com/1.0.0/js/ionic.bundle.js"></script> 
 
    </head> 
 
    <body ng-app="app"> 
 
    <ion-pane> 
 
     <ion-header-bar class="bar-stable"> 
 
     <h1 class="title">Awesome App</h1> 
 
     </ion-header-bar> 
 
     <ion-content class="padding"> 
 
     Selected Answer {{answer}} 
 
     <div class="list"> 
 
    <label class="item item-radio"> 
 
    <input type="radio" name="group" ng-model="answer" value="Canada"> 
 
     <div class="item-content"> 
 
     Canada 
 
     </div> 
 
    <i class="radio-icon ion-checkmark"></i> 
 
    </label> 
 
    <label class="item item-radio"> 
 
    <input type="radio" name="group" ng-model="answer" value="Africa"> 
 
     <div class="item-content"> 
 
     Africa 
 
     </div> 
 
    <i class="radio-icon ion-checkmark"></i> 
 
    </label> 
 
    <label class="item item-radio"> 
 
    <input type="radio" name="group" ng-model="answer" value="North America"> 
 
     <div class="item-content"> 
 
     North America 
 
     </div> 
 
    <i class="radio-icon ion-checkmark"></i> 
 
    </label> 
 
</div> 
 
     </ion-content> 
 
    </ion-pane> 
 
    </body> 
 
</html>

+0

Мой плохо, я совершенно забыл о ценности! Большое спасибо! :-) – Batzi