nullのプロパティを設定できません。

Question

プロパティ 'actualLocation' of nullを設定できません。 私はすべての変数をグローバルに宣言してみましたので、後で使うことができますが、変数を呼び出してそのプロパティを設定しようとすると、どうしてnullが続くのかわかりません。 私は初心者ですので、忍耐を持ってください。

任意のアイデア

私はとエラー行マーク：--->

import { 
Component, 
OnInit 
} from '@angular/core'; 
declare var google: any; 

@Component({ 
selector: 'app-main-screen', 
templateUrl: './main-screen.component.html', 
styleUrls: ['./main-screen.component.css'] 
}) 

export class MainScreenComponent implements OnInit { 

public actualLocation: any; 
public map: any; 
public marker: any; 
public circleRadius: any; 
public contentString: any; 
public infowindow: any; 
public options = { 
    enableHighAccuracy: true, 
    timeout: 5000, 
    maximumAge: 0 
}; 
constructor() {} 

ngOnInit() { 

    function success(pos) { 
     let crd = pos.coords; 

     this.actualLocation = {  <------ Cannot set property 'actualLocation' of null 
      center: { 
       lat: crd.latitude, 
       lng: crd.longitude 
      }, 
      radiusValue: 100 
     }; 
    }; 

    function error(err) { 
     console.warn(`ERROR(${err.code}): ${err.message}`); 
    }; 

    navigator.geolocation.getCurrentPosition(success, error, this.options); 

    //Generate Map => map; 
    function generateMap() { 
     this.map = new google.maps.Map(document.getElementById('map'), { 
      mapTypeControl: false, 
      center: { 
       lat: this.actualLocation.center.lat, 
       lng: this.actualLocation.center.lng 
      }, 
      zoom: 15, 
      zoomControlOptions: { 
       position: google.maps.ControlPosition.LEFT_CENTER 
      }, 
      streetViewControlOptions: { 
       position: google.maps.ControlPosition.LEFT_CENTER 
      }, 
     }); 
    } 

    //Generate Marker => marker && Radius => radius; 
    function generateMarkerAndRadius() { 
     this.marker = new google.maps.Marker({ 
      map: this.map, 
      position: this.actualLocation.center 
     }); 

     this.circleRadius = new google.maps.Circle({ 
      strokeColor: '#FF0000', 
      strokeOpacity: 0.8, 
      strokeWeight: 2, 
      fillColor: '#FF0000', 
      fillOpacity: 0.35, 
      map: this.map, 
      center: this.actualLocation.center, 
      radius: Math.sqrt(this.actualLocation.radiusValue) * 100 
     }); 

    } 

    //Generate Message => message; 
    function generateMessage() { 
     this.contentString = 
      '<div id="content">' + 
      '<p>Hello</p>' + 
      '</div>'; 

     this.infowindow = new google.maps.InfoWindow({ 
      content: this.contentString 
     }); 

     this.infowindow.open(this.map, this.marker); 
    } 
} 
} 

Answer 1

あなたはarrow functionを使用する必要があり、これはこの場合には機能successない成分を意味します変更する場合は

function success((pos) => { 
     let crd = pos.coords; 

     this.actualLocation = { 
      center: { 
       lat: crd.latitude, 
       lng: crd.longitude 
      }, 
      radiusValue: 100 
     }; 
    });