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>

我的功能

$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>

假设有人填写表格，第一个收音机为“是”，第二个收音机为“否”。 studentObj的输出将为

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

这是Angular的美丽。您不需要手动推送值，数据绑定会为您完成所有这些操作，并且您不需要使用不必要的代码来混淆控制器。

如何使用angularjs中的单选按钮将值推送到数组中

1 个答案: