Question

我有一个使用AngularJS的rails应用程序，我有一个表单问题，问题是我想使用复选框发送值为true或false，但它只在检查时发送true，如果检查则发送false并在此之后取消选中，但如果用户未触摸该复选框，则它甚至不会作为参数发送。

  <div class="checkbox">
    <label>
      <input type="checkbox" ng-model="car"> Do you have a car?
    </label>
  </div>

如果用户没有检查它，我该怎么做才能发送它？

编辑：整个表格就是这个，顺便说一下，关于创建民意调查的形式，汽车的事情只是一个例子......

<h1>Create Poll</h1>

<form ng-submit="addPoll()" style="margin-top:30px;">

  <div class="form-group">
    <label>Title</label>
    <input type="text" class="form-control" ng-model="title"></input>
  </div>

  <div class="form-group">
    <label>Description</label>
    <textarea type="text" class="form-control" ng-model="description"></textarea>
  </div>

  <br>
  <div class="checkbox">
    <label>
      <input type="checkbox" ng-model="allow_anonymous_answer" ng-false-value="false"> Allow anonymous answers
    </label>
  </div>
  <br>

  <div class="form-group">
    <label>Welcome message</label>
    <textarea type="text" class="form-control" ng-model="initial_message"></textarea>
  </div>

  <div class="form-group">
    <label>Outgoing Message</label>
    <textarea type="text" class="form-control" ng-model="final_message"></textarea>
  </div>

  <button type="submit" class="btn btn-primary" style="float: right;">Continue</button>

</form>

当你点击继续时，我使用Restangular发出HTTP POST请求来创建一个Poll，但问题是，当我没有触摸复选框时，这就是我在Rails日志中看到的内容......

Started POST "/polls.json" for 127.0.0.1 at 2016-01-26 14:05:57 -0300
Processing by PollsController#create as JSON
  Parameters: {"title"=>"asddddddddddddddda", "description"=>"aaaaaaaaaaaaaaaaaaaaa", "initial_message"=>"asdasdddddddddd", "final_message"=>"aaaaaaaaaaaaaaaaaaad", "poll"=>{"title"=>"asddddddddddddddda", "description"=>"aaaaaaaaaaaaaaaaaaaaa", "initial_message"=>"asdasdddddddddd", "final_message"=>"aaaaaaaaaaaaaaaaaaad"}}

请注意，参数 allow_anonymous_answer 甚至没有出现，如果我选中复选框，那么我可以看到该参数设置为true，如果我检查它然后取消选中它，那么就设置了为假，但问题是当用户甚至没有碰到这个时，发生这种情况时，参数甚至都没有显示......

万一你想看，这是AngularJS的控制器......

angular.module('myapp').controller('CreatePollCtrl', ['$scope', 'Restangular',
function($scope, Restangular) {
  Restangular.setFullResponse(true);

  $scope.addPoll = function() {
    var poll = {title: $scope.title, description: $scope.description, allow_anonymous_answer: $scope.allow_anonymous_answer, initial_message: $scope.initial_message, final_message: $scope.final_message};
    Restangular.all('polls').post(poll).then(function(response) {
    });
  };
}]);

Answer 1

我认为您应该在控制器中放置一个变量来实现HTML组件和JS代码之间的绑定。

我目前正在开发一个Angular应用程序，我所做的是初始化我的控制器的第一行中的所有ng-model变量，所以为什么不尝试这个：

在您的第一个控制器行中：

$scope.allow_anonymous_answer = false;

Answer 2

您是否看过角度文档：https://docs.angularjs.org/api/ng/input/input[checkbox]

您可以使用ng-false-value

明确说明未选中复选框时应发送的值

Answer 3

向ng-click添加checkbox并在那里更新模型。工作正常。

<div class="checkbox">
    <label>
      <input type="checkbox" ng-model="car" ng-click="updateCar(this)">Do you have a car?</input>
    </label>
</div>

在您的控制器中：

var updateCar = function(checkbox) {
    if (checkbox.checked) {
        car = false;
    }
    else {
        car = true;
    }
}

Answer 4

我解决了......

在控制器中

if ($scope.allow_anonymous_answer == null)
  $scope.allow_anonymous_answer = false

复选框不发送错误值

4 个答案: