Question

我有一个问题，我试图将模型中的复选框的值发布到服务器，并且由于复选框未在表单上进行交互，因此angular似乎没有为其赋值，当我询问复选框的值是否为undefined。

这是我的标记：

<div class="form-group">
    <input id="templateDisable" type="checkbox" ng-model="template.disabled" />
    <label for="templateDisable">Disabled</label>
</div>

这是我的控制器上保存操作的简化版本：

$scope.save = function (form) {
    if (form.$valid) {
        var formData = new FormData();
        // this is the problem line of code
        formData.append("disabled", $scope.template.disabled);
        // ... some other stuff
    }
};

实际上，在我点击保存操作之前勾选然后勾选复选框导致template.disabled属性为false，这是我没有任何人工干预的预期。

我见过其他相关问题，例如AngularJS: Initial checkbox value not in model但肯定会像一个简单的复选框一样被烘烤？我当然不应该写指令来管理复选框吗？

Answer 1

这是每个设计。如果您希望模型上的默认值比在控制器内部初始化（推荐），或使用ng-init。

app.controller('AppController',
    [
      '$scope',
      function($scope) {
        $scope.template = {
          disabled = false
        };
      }
    ]
  );

<div class="form-group">
  <input type="checkbox" ng-model="template.disabled" ng-init="template.disabled=false" />
  <label>Disabled</label>
</div>

Answer 2

以下内容将始终在加载（或刷新）页面时将状态设置为“未选中”。换句话说，只要刷新页面，它就会覆盖用户的实际选择。

<input type="checkbox" ng-model="template.disabled" 
 ng-init="template.disabled=false" />

但是，如果您希望复选框状态最初设置为默认状态和，您还希望它能够记住用户交互，那么以下是您想要的。

<input type="checkbox" ng-model="template.disabled" 
 ng-init="template.disabled = template.disabled || false" />

AngularJS复选框模型值未定义

2 个答案: