2016-11-07 118 views
0

decreament值我有這樣的代碼:NG-變化增量和NG-repeat循環

<!DOCTYPE html> 
 
    <html xmlns="http://www.w3.org/1999/xhtml"> 
 
    <head> 
 
     <title>Welcome to LearnKode - A code learning platform</title> 
 
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script> 
 
    </head> 
 
    <body ng-app="changeExample"> 
 
     <div ng-controller="ExampleController"> 
 
      <div class="container"> 
 
       <div class="col-md-3 well"> 
 
        Are you developer <input type="checkbox" ng-model="isTrue" ng-change="count=count+1" /> 
 
        Count: {{count}} 
 
        <pre>{{isTrue}}</pre> 
 
       </div> 
 
      </div> 
 
     </div> 
 
     <script> 
 
     var app = angular.module("changeExample", []); 
 
     app.controller('ExampleController', ['$scope', function ($scope) { 
 
      $scope.isTrue = true; 
 
     }]); 
 
    </script> 
 
    </body> 
 
    </html>

在這段代碼時選中的複選框的數量會增加。這裏如何檢查複選框是否勾選,然後只增加,否則如果不勾選,它會減少。請任何人幫忙。

+0

嘗試'NG-變化= 「IsTrue運算(計數=計數+ 1):(數=計-1)' –

+0

那麼什麼是你的這個要求呢?」 我有多個ng-repeat循環中的複選框「 – Nitheesh

回答

1

<!DOCTYPE html> 
 
<html xmlns="http://www.w3.org/1999/xhtml"> 
 

 
<head> 
 
    <title>Welcome to LearnKode - A code learning platform</title> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script> 
 
</head> 
 

 
<body ng-app="changeExample"> 
 
    <div ng-controller="ExampleController"> 
 
    <div class="container"> 
 
     <div class="col-md-3 well"> 
 
     Are you developer 
 
     <input type="checkbox" ng-model="isTrue" ng-change="isTrue ? (count=count+1) :(count=count-1) " />Count: {{count}} 
 
     <pre>{{isTrue}}</pre> 
 
     </div> 
 
    </div> 
 
    </div> 
 
    <script> 
 
    var app = angular.module("changeExample", []); 
 
    app.controller('ExampleController', ['$scope', 
 
     function($scope) { 
 
     $scope.isTrue = false; 
 
     } 
 
    ]); 
 
    </script> 
 
</body> 
 

 
</html>

嘗試改變NG-變化。

+0

thanku Nikhil .. – SARAN

1

這將爲你工作。

<!DOCTYPE html> 
 
    <html xmlns="http://www.w3.org/1999/xhtml"> 
 
    <head> 
 
     <title>Welcome to LearnKode - A code learning platform</title> 
 
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script> 
 
    </head> 
 
    <body ng-app="changeExample"> 
 
     <div ng-controller="ExampleController"> 
 
      <div class="container"> 
 
       <div class="col-md-3 well" ng-repeat="Option in OptionList"> 
 
        Are you {{Option.choice}} <input type="checkbox" ng-model="Option.value" ng-change="UpdateCount(Option)" /> 
 
        Count: {{Option.count}} 
 
        <pre>{{Option.isTrue}}</pre> 
 
       </div> 
 
      </div> 
 
     </div> 
 
     <script> 
 
     var app = angular.module("changeExample", []); 
 
     app.controller('ExampleController', ['$scope', function ($scope) { 
 
      $scope.isTrue = false; 
 
\t \t \t $scope.count = 0; 
 
\t \t \t $scope.OptionList = [{ 
 
\t \t \t choice: "Developer", 
 
\t \t \t value: false, 
 
\t \t \t count: 0 
 
\t \t \t },{ 
 
\t \t \t choice: "Tester", 
 
\t \t \t value: false, 
 
\t \t \t count: 0 
 
\t \t \t },{ 
 
\t \t \t choice: "Lead", 
 
\t \t \t value: false, 
 
\t \t \t count: 0 
 
\t \t \t },{ 
 
\t \t \t choice: "Architect", 
 
\t \t \t value: false, 
 
\t \t \t count: 0 
 
\t \t \t } 
 
\t \t ]; 
 
\t \t $scope.UpdateCount = function(Option){ 
 
\t \t if(Option.value){ 
 
\t \t Option.count = Option.count + 1; 
 
\t \t } 
 
\t \t else { 
 
\t \t Option.count = Option.count - 1; 
 
\t \t } 
 
\t \t } 
 
     }]); 
 
    </script> 
 
    </body> 
 
    </html>

+0

我在ng-repeat循環中有多個複選框 – SARAN

+0

您可以使用模型值作爲ng-repeat屬性並將該屬性傳遞給同一個函數。不是一個好的編碼程序。 – Nitheesh