anglejsのラジオボタンを使用して配列に値をプッシュする方法

Question

ラジオボタンをチェックするたびに値を配列にプッシュしようとしています。どうすればこれを達成できますか？

<div class="form-group" show-errors> 
    <div class="col-sm-12" > 
     <div class="form-group col-xs-12 nopadding" > 
      <label class="control-label" for="mobile">Have you taken any admission tests? (eg. IELTS, GRE, etc)</label> 
      <div class="btn-group col-xs-12 nopadding" data-toggle="buttons"> 
       <label class="col-xs-6 btn btn-white" ng-click="checkMultiSelect(vm.studentObj,admission)" ng-class="{'active':vm.studentObj.test_taken === 'Y'}"> 
        <input type="radio" name="test_taken" ng-model="vm.studentObj.test_taken" value="Y"> Yes 
       </label> 
       <label class="col-xs-6 btn btn-white" ng-click="checkMultiSelect(vm.studentObj,'test_taken','N')" ng-class="{'active':vm.studentObj.test_taken === 'N'}"> 
        <input type="radio" name="test_taken" ng-model="vm.studentObj.test_taken" value="N"> No 
       </label> 
      </div> 
     </div> 
    </div> 
</div> 
<div class="form-group" show-errors> 
    <div class="col-sm-12" > 
     <div class="form-group col-xs-12 nopadding" > 
      <label class="control-label" for="mobile">Educational Info (High School/ Secondary/ Primary/ Pre School)</label> 
      <div class="btn-group col-xs-12 nopadding" data-toggle="buttons"> 
       <label class="col-xs-6 btn btn-white" ng-click="checkMultiSelect(vm.studentObj,Educational)" ng-class="{'active':vm.studentObj.test_taken === 'Y'}"> 
        <input type="radio" name="test_taken" ng-model="vm.studentObj.test_taken" value="Y"> Yes 
       </label> 
       <label class="col-xs-6 btn btn-white" ng-click="checkMultiSelect(vm.studentObj,'test_taken','N')" ng-class="{'active':vm.studentObj.test_taken === 'N'}"> 
        <input type="radio" name="test_taken" ng-model="vm.studentObj.test_taken" value="N"> No 
       </label> 
      </div> 
     </div> 
    </div> 
</div> 

My機能

$rootScope.checkMultiSelect = function (data, key) { 
    if (!data) { 
    data = []; 
    } 
    var idx = data.indexOf(key); 
    if (idx > -1) { 
    data.splice(idx, 1); 
    } else { 
    data.push(key); 
    } 
}; 

Answer 1

手動でフォームを表すオブジェクトを取得するためにデータをプッシュする必要はありません。 Angularのデータバインディングはこれを行います。

<form ng-form="studentForm"> 
    <div class="form-group" show-errors> 
     <div class="col-sm-12" > 
      <div class="form-group col-xs-12 nopadding" > 
       <label class="control-label" for="mobile">Have you taken any admission tests? (eg. IELTS, GRE, etc)</label> 
       <div class="btn-group col-xs-12 nopadding" data-toggle="buttons"> 
        <label class="col-xs-6 btn btn-white" ng-class="{'active':studentObj.test_taken === 'Y'}"> 
         <input type="radio" name="test_taken" ng-model="studentObj.test_taken" value="Y"> Yes 
        </label> 
        <label class="col-xs-6 btn btn-white" ng-class="{'active':studentObj.test_taken === 'N'}"> 
         <input type="radio" name="test_taken" ng-model="studentObj.test_taken" value="N"> No 
        </label> 
       </div> 
      </div> 
     </div> 
    </div> 
    <div class="form-group" show-errors> 
     <div class="col-sm-12" > 
      <div class="form-group col-xs-12 nopadding" > 
       <label class="control-label" for="mobile">Educational Info (High School/ Secondary/ Primary/ Pre School)</label> 
       <div class="btn-group col-xs-12 nopadding" data-toggle="buttons"> 
        <label class="col-xs-6 btn btn-white" ng-class="{'active':studentObj.edu_info === 'Y'}"> 
         <input type="radio" name="test_taken" ng-model="studentObj.edu_info" value="Y"> Yes 
        </label> 
        <label class="col-xs-6 btn btn-white" ng-class="{'active':studentObj.edu_info === 'N'}"> 
         <input type="radio" name="test_taken" ng-model="studentObj.edu_info" value="N"> No 
        </label> 
       </div> 
      </div> 
     </div> 
    </div> 
</form> 

誰かが最初のラジオを「はい」、2番目を「いいえ」と書いているとします。 studentObjの出力は

{ 
    test_taken: 'Y', 
    edu_info: 'N' 
} 

です。これはAngularの美しさです。手動で値をプッシュする必要はありません。データバインディングはすべてこれを行い、不要なコードでコントローラを混乱させる必要はありません。