复选框

时间:2016-09-23 06:21:49

标签: angularjs checkbox angularjs-ng-click angularjs-ng-checked

我有一个显示取消激活帐户的复选框,当在请求中选中复选框时,我需要将activationstatus发送为false以显示取消激活帐户,取消选中时,它应将值传递为true。我的复选框只是在初始化$ scope.checkedStatus = true后传递相同的值。值不会传递为false。

HTML:

<div>
<input type="checkbox" ng-model="checkedStatus" ng-click = "viewAccount">
  Show Deactivated Account
</div> 

JS:

 $scope.checkedStatus = true;
 $scope.viewAccount = function(){

              var json = {
  "json": {
    "request": {
      "servicetype": "6",
      "functiontype": "6014",
      "session_id": $rootScope.currentSession,
           "data": {
        "shortname": $scope.model.selectShortName,
        "groupzname": $scope.model.selectGname,
        "city": $scope.model.selectCity,
        "state": $scope.model.selectState,
        "country": $scope.model.selectCountry,
        "groupzcode": $scope.model.selectGcode,
         "activationstatus": !($scope.checkedStatus),
        "details": false,
        "sortbasedon": $scope.groupzname,
        "orderby": "desc",
        "offset":$scope.pagination
           }

    }
  }
};

    UserService.viewListAccount(json).then(function(response) {
    if (response.json.response.statuscode == 0)
                        {
                   $scope.tableData = response.json.response.data; 
                        }
                }); 
        };

自动复选框不会更改值。

4 个答案:

答案 0 :(得分:0)

你可以使用

  

NG-变化

输入。 在这里你可以用HTML做到这一点。

<input type="checkbox" ng-model="checkedStatus" ng-click = "viewAccount" ng-change="change()">
  Show Deactivated Account
</div> 

这将如何在您的控制器中访问它。

$scope.change = function() {
  $scope.viewAccount();
}

答案 1 :(得分:0)

在你的json中,你只是否定$scope.checkedStatus但不改变其值。所以总是得到相同的结果。
您可以更改范围值,而不是在json中使用!($scope.checkedStatus)

 $scope.checkedStatus = true;
 $scope.viewAccount = function(){
   $scope.checkedStatus = !$scope.checkedStatus; //check this line
    var json = {
    "json": {
      "request": {
        "servicetype": "6",
        "functiontype": "6014",
          .
          .
          "activationstatus": $scope.checkedStatus,
          .
          .
          "orderby": "desc",
          "offset":$scope.pagination
             }

      }
    }
};

答案 2 :(得分:0)

在$ scope中创建一个包装器对象 model ,并在其中创建checkedStatus属性。

$scope.model = {
    checkedStatus: true
};

并在引用的地方进行相关更改。

喜欢在html中进行这些更改

ng-click="viewAccount()" ng-model="model.checkedStatus"

另外作为旁注,您不应该直接在作用域上附加属性,并且总是尝试创建包装器对象或使用控制器作为语法来消除此类问题。

查看此文章:AngularJS: If you don't have a dot, you're doing it wrong - See more at: http://zcourts.com/2013/05/31/angularjs-if-you-dont-have-a-dot-youre-doing-it-wrong/#sthash.NDNvWL5E.dpuf

答案 3 :(得分:0)

对于复选框,angular具有名为ng-change的特殊指令,而不是使用它。

<div>
   <input type="checkbox" ng-model="checkedStatus" ng-change="viewAccount()">
   Show Deactivated Account
</div>