2017-09-22 8 views
0

正しく動作するionic2アプリケーションでgoogle mapsを使用しています。私が直面している問題は、フォーマットされたアドレスをローカルストレージに保存する方法です。私はページをリロードすると、私はいつも以下ionic2-変数をlocalstorageに保存中

Uncaught TypeError: Cannot read property 'set' of undefined 

を得る

何私は理解していないことに、ユーザーの緯度と経度を保存し上記のスクリプトthis.storage.set('user_lng', this.lng);である私のjavascript

ionViewDidLoad(){ 


    let loader = this.LoadingController.create({ 
     content: 'Getting your Location' 
     }); 
    loader.present().then(()=>{ 
    this.geolocation.getCurrentPosition({ 
     enableHighAccuracy:true 

    }).then((resp) => { 
     //console.log(resp.coords.latitude) 
     //console.log(resp.coords.longitude) 
     this.lng = resp.coords.longitude; 
     this.lat = resp.coords.latitude; 
     this.storage.set('user_lng', this.lng); 
     this.storage.set('user_lat', this.lat); 

     var geocoder; 
     geocoder = new google.maps.Geocoder(); 
     var latlng = new google.maps.LatLng(this.lat, this.lng); 

     geocoder.geocode(
      {'latLng': latlng}, 
      function(results, status) { 
       if (status == google.maps.GeocoderStatus.OK) { 
         if (results[0]) { 
          this.address= results[0].formatted_address ; 
          //var value=add.split(","); 
          console.log("city name is: " + this.address); 
          this.storage.set('user_location', this.address); 
         } 
         else { 
          alert("address not found"); 
         } 
       } 
       else { 
        alert("Geocoder failed due to: " + status); 
       } 
      } 
    ); 

     let latLng = new google.maps.LatLng(this.lat,this.lng); 

      let mapOptions = { 
      center: latLng, 
      disableDefaultUI: true, 
      zoom: 11, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
      } 
      this.map = new google.maps.Map(this.mapElement.nativeElement, mapOptions); 

      this.http.get('assets/locations.json').map(res => res.json()).subscribe(data =>{ 
      //console.log(JSON.stringify(data)); 
      this.usermap= data; 

      let markers= this.usermap; 
      console.log(JSON.stringify(this.usermap)) 



      //this is to mark user current position on map 
      //var iconBase = 'assets/'; 

      var mypos_marker = new google.maps.Marker({ position: latLng, map: this.map,title:'My Position',animation: google.maps.Animation.DROP}); 
      mypos_marker.setMap(this.map); 
      this.myposinfo(mypos_marker); 

      //this is mark user's routes on map 
      for(let marker of markers) { 
      var position = new google.maps.LatLng(marker.latitude, marker.longitude); 
      var myroutes = new google.maps.Marker({position: position, title: marker.title}); 
      myroutes.setMap(this.map); 

      this.addInfoWindowToMarker(myroutes); 
      } 
     }); 
    }) 

    }) 
    loader.dismiss(); 
    } 

    addInfoWindowToMarker(marker) { 
    var infoWindowContent = marker.title; 
    var infoWindow = new google.maps.InfoWindow({ 
     content: infoWindowContent 
    }); 
    marker.addListener('click',() => { 
     infoWindow.open(this.map, marker); 
    }); 
    } 

    myposinfo(mypos_marker) { 
    var infoWindowContent = mypos_marker.title; 
    var infoWindow = new google.maps.InfoWindow({ 
     content: infoWindowContent 
    }); 
    mypos_marker.addListener('click',() => { 
     infoWindow.open(this.map, mypos_marker); 
    }); 
    } 

ですローカルストレージが正常に動作する

答えて

0

インポートセクション内にIonicStorageModuleをインポートしたことを確認してください。

あなたはそれを呼び出す this.storageから
import { IonicStorageModule } from '@ionic/storage'; 


@NgModule({ 
    declarations: [ 

    ], 
    imports: [ 

    IonicStorageModule.forRoot() 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 

    ], 
    providers: [ 
    {provide: ErrorHandler, useClass: IonicErrorHandler} 
    ] 
}) 
+0

app.moduleに – user6579134

0

thisは右の範囲ではありません、それは財産storageは含まれません。何がやりたいことは、関数呼び出しの前に、グローバル変数に保存を保存することです:私はすでにやった

import { IonicStorageModule } from '@ionic/storage'; 
    var storage = this.storage; 

    ionViewDidLoad(){ 
     .... 
     //now replace this.storage with the variable storage 
     .... 
    } 
+0

がテストということと、その動作していません – user6579134

関連する問題