angularjsbindingcheckboxcoffeescriptangularjs-ng-include

Checkbox not binding to scope in angularjs


I am trying to bind a checkbox to scope using ng-model. The checkbox's initial state corresponds to the scope model just fine, but when I check/uncheck the checkbox, the model does not change. Some things to note is that the template is dynamically loaded at runtime using ng-include

app.controller "OrdersController", ($scope, $http, $location, $state, $stateParams, Order) ->

  $scope.billing_is_shipping = false
  $scope.bind_billing_to_shipping = ->
    console.log $scope.billing_is_shipping


<input type="checkbox" ng-model="billing_is_shipping"/>

When I check the box the console logs false, when I uncheck the box, the console again logs false. I also have an order model on the scope, and if I change the checkbox's model to be order.billing_is_shipping, it works fine


Solution

  • I struggled with this problem for a while. What worked was to bind the input to an object instead of a primitive.

    <!-- Partial -->
    <input type="checkbox" ng-model="someObject.someProperty"> Check Me!
    
    // Controller
    $scope.someObject.someProperty = false