我如何解决 angularjs 中的“无法读取未定义的属性'长度'在检查与SeletedModel”
How can i solve "Cannot read property 'length' of undefined at checkWithSeletedModel" in angularjs?
我如何解决此错误"无法读取未定义的属性'长度'在checkWithSeletedModel"。
当我直接在控制器中添加对象时，它可以工作，但是当来自API的数据时，我收到错误
TypeError: Cannot read property 'length' of undefined
at checkWithSeletedModel (newbooking.html:404)
at new MyCtrlFun (newbooking.html:391)
at invoke (angular-1.0.1.js:2795)
at Object.instantiate (angular-1.0.1.js:2805)
at angular-1.0.1.js:4620
at angular-1.0.1.js:4201
at forEach (angular-1.0.1.js:117)
at nodeLinkFn (angular-1.0.1.js:4186)
at compositeLinkFn (angular-1.0.1.js:3838)
at compositeLinkFn (angular-1.0.1.js:3841)
var myApp = angular.module('myApp',[]);
//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});
myApp.controller("MyCtrl", MyCtrlFun);
MyCtrlFun.$inject = ['$scope', '$filter', '$timeout','$http'];
function MyCtrlFun($scope, $filter, $timeout,$http) {
//****** Selected List****
$scope.selectedlist = ["Lumia 735 TS", "Lumia 510"];
$scope.checkbox_model = [];
$scope.checkbox_list = [];
$scope.submitModel = [];
var submodel = [];
var models = {};
var brandname = {};
$scope.finalOutput = {
city:null,
Storename : null,
Offerid : null,
Offer_price : null,
Total_price : null,
Sub_Total_price : null,
Categories : []
}
$scope.finalOutput_withNullFilter = {};
$scope.checkItems = function(){
$scope.checkbox_list = [];
$scope.selectedlist = new Array();
for(var item in $scope.checkbox_model){
if($scope.checkbox_model[item].isChecked)
{
$scope.selectedlist.push($scope.checkbox_model[item].name);
$scope.checkbox_list.push($scope.checkbox_model[item]);
}
}
$scope.checkbox_list.push({offer_id : $scope.selected_offer_id});
//alert(Storename)
/*var m = priceChangeToOffer($scope.selected_offer_id);
if(!isNaN(m)){
$scope.total_price =$scope.total_price-parseInt(m);
}*/
$scope.checkbox_list.push({sub_total : $scope.sub_total});
checkWithSeletedModel();
$scope.finalOutput.city=$scope.phones[0].city;
$scope.finalOutput_withNullFilter = $scope.finalOutput;
if($scope.finalOutput.Storename==null)
{
$scope.finalOutput.Storename = $scope.phones[0].Storename;
}
if($scope.finalOutput.Offerid==null)
{
delete $scope.finalOutput.Offerid;
}
if($scope.finalOutput.Offer_price==null)
{
delete $scope.finalOutput.Offer_price;
}
alert(JSON.stringify($scope.finalOutput));
//****** redefine finalOutput after Submit data to server
$scope.finalOutput = {
city:null,
Storename : null,
Offerid : null,
Offer_price : null,
Total_price : null,
Sub_Total_price : null,
Categories : []
}
}
$scope.selectedbrand = 'Nokia';
$scope.submodel ='Lumia';
$http.get('http://19.168.1.4/shop1/').success(function(data, status, response)
{
//$scope.phones = data
//console.log($scope.phones);
//console i am getting object .here i have added what i have got in console
$scope.phones = [{
"_id": {
"$oid": "56a9c44f40d0275643cfc04e"
},
"default": [],
"Categories": [
{
"models": [
{
"submodel": [
{
"price": "Not available",
"name": "Lumia 735 TS"
},
{
"price": "8100",
"name": "Lumia 510"
},
{
"price": "9900",
"name": "Lumia 830"
}
],
"name": "Lumia"
},
{
"submodel": [
{
"price": "10000",
"name": "Asha 230"
},
{
"price": "11999",
"name": "Asha Asn01"
}
],
"name": "Asha"
}
],
"brandname": "Nokia",
"id": "986745"
},
{
"models": [
{
"submodel": [
{
"price": "5000",
"name": "Trend 840"
},
{
"price": "6999",
"name": "A5"
}
],
"name": "Galaxy"
},
{
"submodel": [
{
"price": "12000",
"name": "Asha 230"
}
],
"name": "Asha"
}
],
"brandname": "Samsung",
"id": "144745"
}
],
"Storename": "Zig Zag Mobiles",
"Shopid":"asdef1234",
"city":"bengaluru",
"__v": 0
}
]
});
//----------------------------Our Shop Offers----------------------------------------
$http.get('http://19.168.1.4/offers/').success(function(data, status, response)
{
//$scope.offers =data;
//console.log($scope.offers);
//console i am getting object .here i have added what i have got in console
$scope.offers = [
{
id: "as23456",
"Storename": "Zig Zag Mobiles",
"Shopid":"asdef1234",
"Offer_message":"1000rs off",
"Categories": [
{
"models": [
{
"submodel": [
{
"price": "1000",
"name": "Lumia 735 TS"
}
],
"name": "Lumia"
}
],
"brandname": "Nokia",
"id": "986745"
}
],
},{
id: "de34575",
"Storename": "Zig Zag Mobiles",
"Shopid":"asdef1234",
"Offer_message":"500rs off",
"Categories": [
{
"models": [
{
"submodel": [
{
"price": "500",
"name": "Lumia 830"
}
],
"name": "Lumia"
}
],
"brandname": "Nokia",
"id": "345645"
}
],
},
{
id: "ert25675",
"Storename": "Zig Zag Mobiles",
"Shopid":"asdef1234",
"Offer_message":"100 Flat",
"Categories": [
{
"models": [
{
"submodel": [
{
"price": "100",
"name": "Asha 230"
}
],
"name": "Asha"
}
],
"brandname": "Samsung",
"id": "345645"
}
],
}
]
});
$scope.offerSelectedList = [];
$scope.total_price = 0, $scope.sub_total=0;
$scope.changeItemStateFun = function(checkbox_value){
if(checkbox_value.isChecked){
if(!isNaN(checkbox_value.price)){
$scope.total_price =$scope.total_price+parseInt(checkbox_value.price);
}
var checked_offer = getOffer([checkbox_value]);
if(checked_offer!=false){
$scope.offerSelectedList.push(checked_offer);
//alert(checked_offer.Categories[0].models[0].submodel[0].name);
}
}else{
if(!isNaN(checkbox_value.price)){
$scope.total_price = $scope.total_price-parseInt(checkbox_value.price);
}
var checked_offer = getOffer([checkbox_value]);
if(checked_offer!=false){
var tempOfferList = [];
for(var i in $scope.offerSelectedList){
if($scope.offerSelectedList[i].id!=checked_offer.id){
tempOfferList.push($scope.offerSelectedList[i]);
}
}
$scope.offerSelectedList = tempOfferList;
}
}
$scope.sub_total = $scope.total_price;
$scope.finalOutput.Total_price = $scope.total_price;
$scope.finalOutput.Sub_Total_price = $scope.sub_total;
}
$scope.selected_offer_id = null;
$scope.submit_offer = {};
$scope.offerSeleted = function(offer){
$scope.selected_offer_id = offer;
var m = priceChangeToOffer($scope.selected_offer_id);
if(!isNaN(m.Offer_price)){
$scope.sub_total =$scope.total_price-parseInt(m.Offer_price);
}
$scope.finalOutput.Storename = m.Storename;
$scope.finalOutput.Offerid = m.Offerid;
$scope.finalOutput.Offer_price = m.Offer_price;
$scope.finalOutput.Total_price = $scope.total_price;
$scope.finalOutput.Sub_Total_price = $scope.sub_total;
}
function getOffer(checkedItem){
for(var i=0; i<checkedItem.length; i++){
for(var j=0; j<$scope.offers.length; j++){
for(var k=0;k<$scope.offers[j].Categories.length; k++){
for(var m=0; m<$scope.offers[j].Categories[k].models.length; m++){
for(var n=0; n<$scope.offers[j].Categories[k].models[m].submodel.length; n++){
if($scope.offers[j].Categories[k].models[m].submodel[n].name==checkedItem[i].name){
return $scope.offers[j];
}
}
}
}
}
}
return false;
}
//-----------------------------------------------------------------------------------
checkWithSeletedModel();
function checkWithSeletedModel(){
$scope.finalOutput.Categories = [];
$scope.submitModel = [];
submodel = [];
models = {};
brandname = {};
$scope.offerSelectedList = [];
$scope.total_price = 0;
$scope.checkbox_model = [];
for(var i=0; i<$scope.phones.length; i++){
for(var j=0; j<$scope.phones[i].Categories.length; j++){
if($scope.phones[i].Categories[j].brandname==$scope.selectedbrand){
brandname = {
id : $scope.phones[i].Categories[j].id,
brandname : $scope.phones[i].Categories[j].brandname,
models : []
};
models = {};
for(var k=0; k<$scope.phones[i].Categories[j].models.length; k++){
if($scope.phones[i].Categories[j].models[k].name==$scope.submodel){
models = {
name : $scope.phones[i].Categories[j].models[k].name,
submodel : []
}
for(var m=0; m<$scope.phones[i].Categories[j].models[k].submodel.length; m++){
var verifyIsCheck = false;
if($scope.selectedlist.length>0){
verifyIsCheck=verifyIsChecked($scope.phones[i].Categories[j].models[k].submodel[m].name);
}
if(verifyIsCheck==true){
models.submodel.push({name : $scope.phones[i].Categories[j].models[k].submodel[m].name, price:($scope.phones[i].Categories[j].models[k].submodel[m].price=='Not available'?null:$scope.phones[i].Categories[j].models[k].submodel[m].price)});
//models.submodel
}
var obj1 = {isChecked :verifyIsCheck, name : $scope.phones[i].Categories[j].models[k].submodel[m].name, price:$scope.phones[i].Categories[j].models[k].submodel[m].price};
//$scope.changeItemStateFun(obj1);
var checkedOffer = getOffer([obj1]);
if(checkedOffer!=false && verifyIsCheck==true){
$scope.offerSelectedList.push(checkedOffer);
}
if(verifyIsCheck==true && !isNaN(obj1.price)){
$scope.total_price = $scope.total_price+parseInt(obj1.price);
}
$scope.checkbox_model.push(obj1);
}
}
}
brandname.models.push(models);
$scope.submitModel.push(brandname);
}
}
}
$scope.finalOutput.Categories.push($scope.submitModel);
}
function verifyIsChecked(submodel_name){
for(var i=0; i<$scope.selectedlist.length; i++){
if($scope.selectedlist[i]==submodel_name){
return true;
}
}
return false;
}
//********** For total sum checked model and change according to offer
function priceChangeToOffer(offer_id){
for(var j=0; j<$scope.offers.length; j++){
if(offer_id!=$scope.offers[j].id)
continue;
for(var k=0;k<$scope.offers[j].Categories.length; k++){
for(var m=0; m<$scope.offers[j].Categories[k].models.length; m++){
for(var n=0; n<$scope.offers[j].Categories[k].models[m].submodel.length; n++){
var offer_obj = {
Storename : $scope.offers[j].Storename,
Offerid : $scope.offers[j].id,
Offer_price : $scope.offers[j].Categories[k].models[m].submodel[0].price
};
return offer_obj;
}
}
}
}
}
$scope.sub_total = $scope.total_price;
$scope.finalOutput.Total_price = $scope.total_price;
$scope.finalOutput.Sub_Total_price = $scope.sub_total;
}
myApp.filter("removespace", function(){
return function(input){
return input.replace(/[^A-Z0-9]+/ig, "_")
}
});
//]]>
//]]>
//]]> <script type="text/javascript" src="http://code.angularjs.org/angular-1.0.1.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
<div class="item" ng-repeat="item in phones">
<div ng-repeat="cat in item.Categories" ng-show="cat.brandname==selectedbrand">
<h2><b>{{ cat.brandname }}</b></h2>
<div ng-repeat="models in cat.models" ng-show="models.name==submodel">
<h3>
<b>{{models.name}}</b>
</h3>
<div ng-repeat="submodels in models.submodel">
<input type="checkbox" ng-model="checkbox_model[$index].isChecked" ng-change="changeItemStateFun(checkbox_model[$index])"/>{{ submodels.name }}
</div><br/><br/>
<b>Sub Total = {{sub_total}}</b><br/>
<select ng-show="offerSelectedList.length>0" ng-model="selected_item" ng-options="offer.id as offer.Offer_message for offer in offerSelectedList" ng-change="offerSeleted(selected_item)">
<option>select offer</option>
</select>
</div>
</div>
<button ng-click="checkItems()">Do</button>
</div>
</div>how can i solve this pls some one help me out to move forward i have added my code below .
演示
你保留了一个这样的 for 循环：
for(var i=0; i<$scope.phones.length; i++)
在这里，您尝试访问 $scope.phones 变量的长度。但是，您已在 api 调用的成功回调中定义了$scope.phones。但是您的 api 调用都失败了。因此，永远不会调用成功回调，因此$scope.phones始终未定义。因此，您会收到"无法读取未定义的长度"的错误。
相关文章：
- 如何使用数组减少来求和对象属性长度，不带类型
- 我一直得到“无法获得未定义或空引用的属性'长度'”
- 数据表错误 - 无法读取未定义的属性“长度”
- 找不到未定错误的属性长度
- 剑道网格分组列 - 类型错误:无法读取未定义的属性“长度”
- Jquery 无法读取未定义的属性“长度”
- D3 JS - 未捕获的类型错误:无法读取未定义的属性“长度” - 似乎与数据问题有关
- 未捕获的类型错误:无法读取未定义的 [JavaScript] 的属性“长度”
- 无法读取 ajax 中未定义的属性“长度”
- 未捕获的类型错误:当存在父级时，无法读取未定义的属性“长度”
- 使用 Javascript 将样式动态添加到样式表，但我收到“无法读取未定义的属性'长度'”错误
- 无法读取数据表中未定义错误的属性“长度”.js
- 我如何解决 angularjs 中的“无法读取未定义的属性'长度'在检查与SeletedModel”
- 未捕获的类型错误:无法读取 d3.js 中未定义的属性“长度”
- 与正则表达式一起使用时无法读取属性长度 null 错误
- 我收到一个未捕获的类型错误:无法读取 jquery.main.js 上 null 的属性“长度”
- 无法读取未定义的属性“长度”
- Javascript在检查变量的长度时“无法读取未定义的属性'长度'”
- 可以't读取未定义的属性长度-AngularJS
- 当值为NULL时，无法读取未定义的属性长度
