我有一个购物车网络应用程序，它使用 AngularJS 添加一行，并在按下"保存"按钮时将整个表保存到本地存储。我在另一个站点上找到了专注于执行此操作的代码(对于 addRow 部分(，但它对我不起作用。有人有什么想法吗？如果您需要我得到的 AngularJS 文件，我也可以添加它。
<!DOCTYPE html>
<html lang="en" ng-app>
<head>
<meta charset="UTF-8">
<title>AngularJS Shopping Cart</title>
<script src="js/angular10.js"></script>
<script>
function CartController($scope) {
$scope.books =[
{title: 'Absolute Java',
qty: 1, price: 114.95},
{title: 'Pro HTML5',
qty: 1, price: 27.95},
{title: 'Head First HTML5',
qty: 1, price: 27.89}
];
$scope.rows =[
{title: 'New Book', qty: 1, price: 10.99}
];
$scope.removeBook = function(index) {
$scope.books.splice(index, 1);
}
$scope.addRow = function() {
$scope.rows.push($scope.rows);
}
}
</script>
<link rel="stylesheet" href="css/ex05.css">
</head>
<body ng-controller="CartController">
<table>
<caption><b>My Books</b></caption>
<thead>
<tr>
<th>Title</th>
<th>Qty</th>
<th>UnitPrice</th>
<th>$UnitPrice</th>
<th>Line Total</th>
<th>Total </th>
</tr>
</thead>
<tbody ng-repeat="book in books">
<tr>
<td>
<input ng-model="book.title" size="20">
</td>
<td>
<input ng-model="book.qty" size="2">
</td>
<td>
<input ng-model="book.price" size="8">
</td>
<td>{{book.price | currency}}</td>
<td>{{book.price * book.qty | currency}}</td>
<td>
<button ng-click="removeBook($index)">
Remove
</button>
</td>
</tr>
</tbody>
</table>
<div id ="update">
<button id="insert" ng-click="addRow()">
New
</button>
<button id="save" ng-click="save">
Save
</button>
</div>
</body>
</html>
在添加新行上尝试此操作：
$scope.addRow = function() {
$scope.inserted = {
title: "",
qty: "",
price: ""
};
$scope.books.push($scope.inserted);
};