Question

我正在尝试使用AngularJS在表单中显示三个选择下拉菜单（表示生日 - 月，日和年）。然后，此表单需要将这些值发布到我的API。

我有一个月，日和年的数组，我就像这样填充控制器：

$scope.months = myMonthArray;
$scope.user.birthMonth = $scope.months[0];

$scope.days = myDayArray;
$scope.user.birthDay = $scope.days[0];

$scope.years = myYearArray;
$scope.user.birthYear = $scope.years[0];

$scope.register = function(user) {
  $scope.errors = [];
  repository.register(user).$promise.then(
    function() { $location.url('/'); },
    function(response) { $scope.errors = response.data;});
};

我的存储库工厂方法如下所示：

register: function(user) {
  var reg = $resource('/api/registration', null, {
    register: { method: 'POST'}
  });
  return reg.save(user);
}

最后，视图（对于选择如下所示：

<select id="birthMonth" ng-model="user.birthMonth" ng-options="c.name for c in months"></select>
<select id="birthDay" ng-model="user.birthDay" ng-options="c.name for c in days"></select>
<select id="birthYear" ng-model="user.birthYear" ng-options="c.name for c in years"></select>

视图看起来很棒，因为每个选择框都正确填充并显示第一个值。但是，当我提交它时，我的.NET APT模型无法捕获值 - 查看Fiddler请求，它看起来像如下：

{"birthMonth":
    {"name":"November","value":11},
  "birthYear":
    {"name":1988,"value":1988},
  "birthDay":
    {"name":23,"value":23}}

表单中的所有其他字段都正确捕获（假设它们只是文本输入），所以我认为问题在于Angular提供值数组而不是简单地发布每个select控件的Value。

我是否正在为每个错误指定模型？或者我需要做什么不同，所以它只传递每个选择字段的值？

谢谢！

Answer 1

使用ng-options表达式，您可以绑定整个对象。如果您只需要获取值字段，请尝试：

ng-options="c.value as c.name for c in months"

您的JS可以更改为：

$scope.months = myMonthArray;
$scope.user.birthMonth = $scope.months[0].value;

持续数天和数年。

选择返回名称/值数组的表单而不仅仅是值

1 个答案: