Angular 未提交复选框

Question

我有一个 angular 表单，其中有一个复选框可供提交。

<form name="productForm" class="form-horizontal" role="form" ng-submit='action(productForm.$valid)' novalidate>
    <div class="form-group">
        <input type='checkbox' name='subtract' data-ng-model='product.subtract'/>
    </div>
</form>

问题是这个东西在数据库中的默认值为1。

我假设如果我不 select 复选框，它将为我在数据库中记录 0。但是不知何故，这个输入复选框没有提交，数据库只是采用定义的默认值“1”。

有人知道这里发生了什么吗？谢谢！

Answer 1

好像你没有在控制器中初始化作用域变量 product.subtract 作为，

$scope.product = {};
$scope.product.subtract = 0; //not selected by default

和

<input type='checkbox' name='subtract' data-ng-model='product.subtract' ng-true-value="1" ng-false-value="0" />

ng-true-value&ng-false-value代表checkboxtruefalse状态基于checked.

if you do not initialize a scope variable within the controller or using ng-init then there is no scope variable create until you made a change to the ng-model. so here, if u dont have the scope variable, and then you submit the form without ticking the checkbox then there is no scope variable called $scope.product.subtract.

Answer 2

除此之外。我注意到在复选框上使用布尔值会导致问题。

将您的模型转换为字符串（或 int）并将输入更改为类似这样的内容

<input type='checkbox' ng-model='mgModel' ng-true-value="'true'" ng-false-value="'false'" />

但是如果你真的使用直接布尔值。您会发现它不会将更改发送到父控制器等。因此这将失败或导致有线绑定问题

<input type='checkbox' ng-model='mgModel' ng-true-value="true" ng-false-value="false" />

因此，如果您在绑定 true/false 值时遇到问题。尝试将其更改为字符串或整数。

Angular 未提交复选框

Angular checkbox not submitted

angularjs

forms