javascript - AngularJS: TypeError: 'null' is not an object (evaluating 'this._element.attr') -
i using angularjs in project. users able add products order , after order put together, can view order overview. works great in chrome in safari unexpected error.
typeerror: 'null' not object (evaluating 'this._element.attr')
here can see code:
angularjs
$scope.order = []; $scope.search = ""; $scope.products = []; $scope.categories = []; //order overview checkout $scope.modal = function(){ modal.show(); }; $scope.modalhide = function(){ modal.hide(); } $scope.removeproduct = function(){ } //compose order add/remove/update $scope.productremove = function($event, pid){ $scope.productid = pid; if($scope.order.length > 0) { for(var b = 0; b<$scope.order.length;b++){ if($scope.order[b].prodid == pid) { if($scope.order[b].aantal > 1) { $scope.order[b].aantal--; document.getelementbyid('aantal').innerhtml = document.getelementbyid('aantal').innerhtml - 1; } else { $scope.order.splice(b,1); document.getelementbyid('aantal').innerhtml = '+'; //update quantity in app ui! } } } } } $scope.productadd = function($event,pname, pid, pprice) { $scope.pzelfdeid = -1; $scope.pzelfde = -1; $scope.prodname = pname; $scope.prodid = pid; $scope.price = pprice; if($scope.order.length == 0){ $scope.order.push({prodid: $scope.prodid, prodname: $scope.prodname, aantal: 1, price: $scope.price, size: 'm', extras: ''}); $event.currenttarget.innerhtml = 1; } else if($scope.order.length > 0){ for(var b = 0; b<$scope.order.length;b++) { if($scope.order[b].prodid == pid) { $scope.pzelfdeid = $scope.order[b].prodid; $scope.pzelfde = b; } } if($scope.pzelfde > -1) { $scope.order[$scope.pzelfde].aantal++; $event.currenttarget.innerhtml = $scope.order[$scope.pzelfde].aantal; } else { $scope.order.push({prodid: $scope.prodid, prodname: $scope.prodname, aantal: 1, price: $scope.price, size: 'm', extras: ''}); $event.currenttarget.innerhtml = 1; } } } }])
html
<ons-modal var="modal"> <ons-page> <ons-toolbar> <div class="left"><a href=""; ng-click="modalhide()"><img src="../images/backarrow.png"/></a></div> <div class="right"><a href="" ng-click="sendorder(order)"><i class="fa fa-send fa-fw"></i></a></div> </ons-toolbar> <div> <div class="left"><p>{{getquantity()}}</p></div> <div class="right"><p>{{getprice()}}</p></div> </div> <ons-list width="100%"> <ons-list-item class="list-item" ng-repeat="o in order" ng-if="o.length >= 0"> <ons-carousel swipeable initial-index="0" auto-scroll> <ons-carousel-item class="list-action-item"> <ons-row> <ons-col width="13%"> <p>{{o.aantal}}</p> </ons-col> <ons-col width="72%"> <div class="name"> {{o.prodname}} </div> <div class="desc"> {{o.prodname}} </div> </ons-col> <ons-col width="15%"> <p>{{o.size}}</p> </ons-col> </ons-carousel-item> <ons-carousel-item class="list-action-menu"> <p>remove<a ng-click="productremove($event, o.prodid, o.prodname)"><i class="fa fa-times fa-fw" style="color: white"></i></a></p> <p>cancel<i class="fa fa-arrow-right fa-fw"></i></p> </ons-carousel-item> </ons-carousel> </ons-list-item> </ons-list> </ons-page> </ons-modal>
at first order (o) of course empty array user can add products to. think problem ng-repeat o in order
trying values of empty array. show right amount of rows (3 rows if order consists of 3 products) refuses show data... how can solve problem?
Comments
Post a Comment