Question

我的问题不仅仅是我的问题标题所说的。我有一个表，我可以在其中输入每行的值并添加/删除新行。

HTML

<div ng-app="ArrayApp">
    <div ng-controller="arrayController">

          <form ng-submit="addNew()">
                            <table class="table table-striped table-bordered">
                                <thead>
                                    <tr>
                                        <th><input type="checkbox" ng-model="selectedAll" ng-click="checkAll()" /></th>
                                        <th>Item No</th>
                                        <th>Product</th>
                                        <th>Quantity</th>
                                        <th>Unit Price</th>
                                        <th>Line Total</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr ng-repeat="lineItem in lineItems">
                                        <td><input type="checkbox" ng-model="lineItem.selected"/></td>
                                        <td>
                                            <select class="form-control" ng-model="lineItem.item" ng-options="item as item.itemCode for item in items" name="ItemCode" style="width: 100%;">
                                                <option value="0">Select Item</option>
                                            </select>
                                        </td>

                                        <td><input type="text" class="form-control" ng-model="lineItem.item.itemName"  required /></td>
                                        <td><input type="number" class="form-control" ng-model="lineItem.quantity" required /></td>
                                        <td><input type="number" class="form-control" ng-model="lineItem.item.unitPrice"  required /></td>
                                        <td><span ng-model="lineItem.lineTotal">{{getLineTotal(lineItem)}}</span></td>
                                    </tr>
                                </tbody>
                            </table>
                            <div class="form-group">
                                <input ng-hide="!lineItems.length" type="button" class="btn btn-danger pull-right" ng-click="remove()" value="Remove">
                                <input type="submit" class="btn btn-primary addnew pull-right" value="Add New">
                            </div>
                        </form>

    </div>
</div>

下面的脚本包含添加新行，删除行等的功能。

角

$scope.lineItems = [];
$scope.addNew = function (lineItem) {
                $scope.lineItems.push({
                    'item.itemName': '',
                    'quantity': 1,
                    'item.unitPrice': ''
                });

                //$scope.getTotal();
            };

            $scope.getTotal = function () {
                var total = 0;

                for (var i = 0; i < $scope.lineItems.length; i++) {
                    var lineItem = $scope.lineItems[i];
                    total += (lineItem.quantity * lineItem['item.unitPrice']);
                    vm.salesInvoice.totalAmount = total;
                }

                return total;
            }

            $scope.getLineTotal = function (lineItem) {
                var total = 0;
                if (!lineItem['item.unitPrice'])
                    return total;
                var total = lineItem.quantity * lineItem['item.unitPrice'];
                return total;
            }

现在我想在这里实现的是这个;

我从服务器将数据从数据库提取到vm.items并将数据拉入ng-repeat内的下拉列表中。我希望当我从下拉列表中选择一个项目时，相应的项目值将显示在表格行内的ng-model（lineItem.item.itemName）和lineItem.item.unitPrice的控件上。这与这里显示的代码非常吻合。但是这里的问题是lineItem.item.itemName和lineItem.item.unitPrice的显示值不是针对$ scope.lineItems数组对象中的键捕获的。（调试时值是空的）据我所知，我在这里看不到任何错误。我需要帮助。

请参阅Fiddle以更多地了解问题。请帮助为vm.items创建一个示例JSON数组，以查看它是如何工作的。

如何从控件获取数组对象值

0 个答案: