<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="https://cdn.staticfile.org/angular.js/1.4.6/angular.min.js"></script> <script> var app = angular.module("myApp", []); app.controller("myCtrl", function($scope) { $scope.goods = [{ num: 1, price: 10 }, { num: 1, price: 10 }, { num: 1, price: 10 }, { num: 1, price: 10 }, { num: 1, price: 10 }, { num: 1, price: 10 }, { num: 1, price: 10 }, { num: 1, price: 10 }, { num: 1, price: 10 }, { num: 1, price: 10 }]; //总计 $scope.allPrice = 0; $scope.getAllPrice = function() { var count = 0; $scope.good = $scope.goods.filter(function(e) { return e.price != '' && e.price != 0 && e.price != null; }); for(index in $scope.good) { count += parseInt($scope.good[index].price); } $scope.allPrice = count / $scope.good.length; } $scope.getAllPrice(); }); </script> <style> input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none !important; } </style> </head> <body ng-app="myApp" ng-controller="myCtrl"> <center> <table border="1px"> <tr> <td>价格</td> </tr> <tr ng-repeat="g in goods"> <td> <span ng-show="g.flag">{{g.price}}</span> <input ng-hide="g.flag" ng-model="g.price" ng-change="getAllPrice()" type="number" /> </td> </tr> </table><br /> 平均价： <span>{{allPrice}}</span> </center> </body> </html>