AngularJS中每個列表項的按鈕點擊次數

我有一個列表，我想單獨獲取每個項目的按鈕點擊次數。我已經創建了一個示例example，但增加了所有項目。請幫忙。一件重要的事情是，JSON沒有「計數」鍵。你可以通過修改陣列中的對象數組做AngularJS中每個列表項的按鈕點擊次數

var myApp = angular.module('myApp',[]); 

var jsonInfo = {"count":["one", "two", "three", "four"]} 

function MyCtrl($scope) { 
    $scope.data =jsonInfo; 

    $scope.counter = 0; 
    $scope.count = function (inc) { 
    $scope.counter += inc; 
    }; 
}

來源

2017-03-27 Vimal

一種方式

var jsonInfo = {"count":[{"name":"one",count:0} ,{"name":"two",count:0} ,{"name":"three",count:0} ,{"name":"four",count:0}]}

現在修改這樣

<li ng-repeat="list in data.count"> 
    <a href="#" ng-click="count(list)"> 
     <span>{{list.name}}</span> 
     <span style="display: block;">Count: {{list.count}}</span> 
    </a> 
    </li>

然後將HTML傳遞OBJ作爲參數傳遞給函數和增加該物體的數量

function MyCtrl($scope) { 
    $scope.data =jsonInfo; 

    $scope.counter = 0; 
    $scope.count = function (inc) { 
     inc.count = inc.count + 1 
    }; 
}

Demo

來源

2017-03-27 11:30:54

試試這個

<!DOCTYPE html> 
 
<html ng-app="myApp"> 
 

 
<head> 
 
\t <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.js"></script> 
 
\t 
 
\t <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
\t <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
\t <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
\t <script type="text/javascript"> 
 
\t \t var myApp = angular.module('myApp',[]) 
 
\t \t .controller('MyCtrl', function MyCtrl($scope) { 
 
\t \t // body... 
 

 

 
\t \t var jsonInfo = [ 
 
\t \t { 
 
\t \t \t count:1, 
 
\t \t \t name:"one" 
 
\t \t }, 
 
\t \t { 
 
\t \t \t count:1, 
 
\t \t \t name:"two" 
 
\t \t }, 
 
\t \t { 
 
\t \t \t count:1, 
 
\t \t \t name:"three" 
 
\t \t }, 
 
\t \t { 
 
\t \t \t count:1, 
 
\t \t \t name:"four" 
 
\t \t }] 
 

 
\t \t $scope.data =jsonInfo; 
 

 
\t \t $scope.counter = 0; 
 
\t \t $scope.count = function (inc) { 
 
\t \t \t inc.count = inc.count +1; 
 
\t \t }; 
 

 
\t }) 
 

 

 
</script> 
 

 
</head> 
 

 
<body> 
 
\t <div ng-controller="MyCtrl"> 
 
\t \t <ul> 
 
\t \t \t <li ng-repeat="list in data"> 
 
\t \t \t \t <a href="#" ng-click="count(list)"> 
 
\t \t \t \t \t <span>{{list.name}}</span> 
 
\t \t \t \t \t <span style="display: block;">Count: {{list.count}}</span> 
 
\t \t \t \t </a> 
 
\t \t \t </li> 
 
\t \t </ul> 
 
\t </div> 
 

 
</body> 
 

 
</html>

來源

2017-03-27 11:38:41

這是主要問題。我無法在JSON文件中添加「計數」。 :( – Vimal

不，你不能使用數據庫 –

AngularJS中每個列表項的按鈕點擊次數

回答

相關問題