ionic2-错误保存变量到localstorage

时间:2017-09-22 17:39:34

标签: javascript google-maps typescript ionic-framework

我在我的ionic2应用程序中使用谷歌地图,这是正确的。我现在面临的问题是如何将格式化的地址保存到本地存储。

当我重新加载页面时,我总是得到

Uncaught TypeError: Cannot read property 'set' of undefined

以下是我的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);
    });
  }

我不明白的是上面的脚本this.storage.set('user_lng', this.lng);,它将用户的经度和经度保存到本地存储工作中

2 个答案:

答案 0 :(得分:0)

确保您已在导入部分

中导入IonicStorageModule
import { IonicStorageModule } from '@ionic/storage';


@NgModule({
  declarations: [

  ],
  imports: [

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

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

答案 1 :(得分:0)

来自this的{​​{1}}您称之为不正确的范围,并且它不会包含属性this.storage。您要做的是在函数调用之前将存储保存在全局变量中:

storage