AngularJS ng-model无法使用输入[radio]

时间:2014-03-30 04:54:04

标签: angularjs

现在我有这样的标记:

<form role="form" name="mprForm" ng-submit="submit()" ng-controller="MprFormController" novalidate> 
  ...     
  <div class="form-group">
    <label for="gender">性别</label>
    <div class="row">
      <div class="col-md-9">
        <label class="radio" for="genderf">
          <input type="radio" ng-model="user.gender" name="gender" value="0" id="genderf" data-toggle="radio" checked flat-radio>
          女
        </label>
        <label class="radio" for="genderm">
          <input type="radio" ng-model="user.gender" name="gender" value="1" id="genderm" data-toggle="radio" flat-radio>
          男
        </label>
      </div>
    </div>
  </div> <!-- 性别选择 -->

  ... 

  <div class="form-group">
    <div class="row">
      <div class="col-md-9">
        <button type="submit" ng-disabled="mprForm.$invalid" class="btn btn-primary btn-block">提交</button>
      </div>
    </div>
  </div> <!-- 提交按钮 --> 
</form> <!-- 修改信息表单 -->

控制器的代码:

/**
 *  修改用户资料表单(基本资料)
 */
.controller('MprFormController', ['$scope', function($scope) {
  $scope.uidata = {};
  $scope.submit = function() {
    console.log($scope.user.gender)
  }
}])

控制器的范围和ng-model的范围之间没有其他范围。但是当我点击按钮时,它会输出undefined。它应该是1或0.当我使用inpect工具设置断点时,我也会在观察者中看到undefined
我正在使用angular.js 1.2.10rc3。这是一个全面的框架,但WTF?

1 个答案:

答案 0 :(得分:0)

user对象未定义,因此user.gender属性提供undefined定义user.gender,而不是使用单选按钮中的“已检查”

$scope.user = {
   gender: 0
}

它会正常工作

示例:http://plnkr.co/edit/18xuzdEQGZ1rkl5FCUkI?p=preview