无法设置null

时间:2017-10-22 16:28:59

标签: javascript angular typescript

无法将属性'actualLocation'设置为null; 我尝试全局声明所有变量,所以我可以使用后者,但我不知道为什么我在调用变量并尝试设置其属性时仍然保持null。 我是javascript的初学者所以请耐心等待;

任何想法

我用以下标记错误行:--->

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);
    }
}
}

1 个答案:

答案 0 :(得分:2)

您需要使用 arrow function ,在这种情况下,这是指函数 success 而不是组件,将其更改为

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

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