2016-01-06 87 views
1

這裏是問題,我對一個代表對象數組的文件做了一個Ajax請求,然後我逐一更新數組中的每個對象,然後將數組存儲在localStorage中一個JSON.stringify。 做完所有這些之後,在控制檯中我得到了具有更新對象的數組,但是當我存儲數組時,它是存儲的舊數組。如何獲得更新的對象

這是我的代碼。

var relaisList; 
function updateRelaisList(){ 
    $.ajax({ 
     "dataType":"json", 
     "url": "assets/json/relaisList.json" 
    }) 
    .done(function(response){ 
     console.log("ajax updatedRelaisList SUCCESS"); 
     //add lat and lng for all relaisList objects 
     for(var i = 0, c = response.length; i < c; i++){ 
      addLatLng(response[i]); 
     } 
     //store the updated array in the localStorage 
     console.log("below is the updatedRelaisList>>>") 
     console.log(response) 
     relaisList = response 
     window.localStorage.setItem("foo", JSON.stringify(relaisList)) 


    }) 
    .fail(function(){ 
     console.log("ajax updateRelaisList FAIL"); 
    }) 
} 

function addLatLng(obj){ 
    var fullAddress = obj.name + "," + obj.address + "," + obj.zip; 
    $.ajax({ 
     "dataType":"json", 
     "url": "https://maps.googleapis.com/maps/api/geocode/json?address=" + fullAddress + "&key=AIzaSyB67tGq_pe2p6ma3QVlkciQaL4-rKIC_UE" 
    }) 
    .done(function(response){ 
     console.log("ajax addLatLng SUCCESS"); 
     //update the object adding 2 properties lat and lng 
     obj.lat = response.results[0].geometry.location.lat; 
     obj.lng = response.results[0].geometry.location.lng; 
     // console.log(obj) 
    }) 
    .fail(function(){ 
     console.log("ajax addLatLng FAIL"); 
    }) 
} 

隨意問了我更多的細節

+1

只是一個快速的猜測,但我的想法是,因爲您使用的是預這個方法也可以調用ajax來向對象添加信息,但之後在本地存儲,本地存儲的更新速度比返回ajax調用更快。 – SpYk3HH

+1

Ajax請求需要一些時間才能完成,並且也是異步的。因此請檢查您嘗試訪問該變量的其他代碼在存儲之前是否未執行。 – Sachin

回答

1

能否請你嘗試下面修改後的代碼。此代碼將等待所有Ajax響應,將數據上傳到本地存儲,只有當所有經/緯會從谷歌地圖獲取:

var relaisList; 
function updateRelaisList(){ 
    $.ajax({ 
     "dataType":"json", 
     "url": "assets/json/relaisList.json" 
    }) 
    .done(function(response){ 
     console.log("ajax updatedRelaisList SUCCESS"); 
     addLatLng(response); 
    }) 
    .fail(function(){ 
     console.log("ajax updateRelaisList FAIL"); 
    }) 
} 

function addLatLng(response){ 
    var updatedResponse =[]; 
    //add lat and lng for all relaisList objects 
    for(var i = 0, c = response.length; i < c; i++){ 
     obj = response[i]; 
     var fullAddress = obj.name + "," + obj.address + "," + obj.zip; 
     $.ajax({ 
      "dataType":"json", 
      "url": "https://maps.googleapis.com/maps/api/geocode/json?address=" + fullAddress + "&key=AIzaSyB67tGq_pe2p6ma3QVlkciQaL4-rKIC_UE" 
     }) 
     .done(function(response_inner){ 
      console.log("ajax addLatLng SUCCESS"); 
      //update the object adding 2 properties lat and lng 
      obj.lat = response_inner.results[0].geometry.location.lat; 
      obj.lng = response_inner.results[0].geometry.location.lng; 
      updatedResponse.push(obj); 
      if(updatedResponse.length == response.length){ 
       //store the updated array in the localStorage 
       console.log("below is the updatedRelaisList>>>") 
       console.log(response) 
       relaisList = response 
       window.localStorage.setItem("foo", JSON.stringify(relaisList)); 
      } 
     }) 
     .fail(function(){ 
      console.log("ajax addLatLng FAIL"); 
     }) 

    } 


}