Angular app会抛出错误

时间:2014-10-10 06:02:56

标签: javascript angularjs

我的代码就像这样

    <div ng-app='myApp' ng-controller="MainCtrl">
<div ng-repeat="prdElement in pacakageElement track by $index" class="package-grid">
    <div style="border: 1px solid; padding-bottom: 10px; padding-top: 10px">
        <input placeholder="Product Code" />
        <input placeholder="Dimension" />
    </div>
    <table class="hovertable">
        <thead>
            <tr>
                <th>Line #</th>
                <th>ITCLS</th>
                <th>Item #</th>
                <th>Line Quantity#</th>
                <th>Ship Quantity</th>
                <th>PickQuantity</th>
                <th>Quantity in Plt</th>
                <th>Allready Packed</th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="data in prdElement.Data" ng-init="data.newquantity  = data.quantity">
                <td>{{data.itemId}}</td>
                <td>{{data.itcls}}</td>
                <td>{{data.itemId}}</td>
                <td>Line Quantity#</td>
                <td>Ship Quantity</td>
                <td>PickQuantity</td>
                <td>
                    <input type="text" ng-model="data.newquantity" placeholder="Quantity" required=required />
                </td>
                <td>Allready Packed</td>
            </tr>
            <tr>
                <td width="100%" colspan="4">
                    <button ng-show="prdElement.show" ng-click="newPackageItem( prdElement,$event)">Next Pallet</button>
                </td>
                <td width="100%" colspan="4">
                    <button ng-show="prdElement.show">Remove Pallet</button>
                </td>
            </tr>
        </tbody>
    </table>
</div>

    (function () {
    angular.module('myApp', []).controller('MainCtrl', function ($scope) {
        var counter = 0;
        $scope.pacakageElement = [{
            name: counter,
            show: true,

            Data: [{
                name: 'item 1',
                itemId: '284307',

                itemCode: '',
                description: 'Bicycle parts - frame',
                quantity: '100',
                handlingUnit: 'CTN',
                weight: '613.04',
                class: '',
                lenght: '102',
                width: '42',
                height: '61',
                flag: 'P'


            }, {
                name: 'item 2',
                itemId: '284308',

                itemCode: '',
                description: 'Bicycle parts - fork',
                quantity: '200',
                handlingUnit: 'CTN',
                weight: '242.99',
                class: '',
                lenght: '75',
                width: '34',
                height: '18',
                flag: 'P'
            }]
        }];


        $scope.newPackageItem = function (packageElement, $event) {
            var npackageElement = {};
            angular.copy(packageElement, npackageElement);
            counter++;
            packageElement.show = false;

            npackageElement.name = counter;
            angular.forEach(npackageElement.Data, function (row) {
                if (row.quantity != row.newquantity || row.quantity != 0) {
                    row.quantity = row.quantity - row.newquantity;

                }

            });

            $scope.packageElement.push(npackageElement);
        };
    });

}());

这里我试图复制我的第一个数据集并对其进行一些计算。除了函数newPackageItem之外,一切正常。单独使用此函数会抛出错误

TypeError: Cannot read property 'push' of undefined
at Scope.$scope.newPackageItem 

Fiddle

1 个答案:

答案 0 :(得分:4)

您将属性“packageElement”拼错为“pacakageElement”。将所有实例更改为使用“packageElement”,它应该可以正常工作。