Uncaught TypeError: Не удается прочитать свойство «еа» нулевых

Question

Я использую angular2 с машинописи и angular2-Google-карты,

Ниже приводится зависимость в файле package.json:

«angular2 -google-карты ":„^ 0.12.0“

Это почти работает довольно хорошо, без проблем, но я столкнулся это исключение при навигации по карте:

Uncaught TypeError: Cannot read property 'ea' of null

Любая идея, как ее решить?

Answer 1

Мы не можем действительно диагностировать код, который вы не разместили. Однако я могу интерпретировать сообщение об ошибке несколько. Где-то внутри кода есть ссылка на объект (назовем его obj) и его свойство (атрибут или поле a.k.a.) ea. Например,

x = obj.ea 

Когда исполнение получил то, что оператор делает ссылку, OBJ был нулевой. Нулевые объекты довольно скучны; среди прочего, у них нет свойств. :-)

Вам необходимо прочитать трассировку стека, чтобы найти, где произошла ошибка, отслеживать значение объекта и выяснить, почему это null, когда оно должно иметь более полезное значение.

Answer 2

Моя проблема точно такая же, и я получаю эту ошибку, когда я нажимаю &, удерживая указатель мыши над картой и начинаю перетаскивать ее. Это не происходит с увеличением или кликами внутри карты или маркеров, только перетаскивание/панорамирование. Не стоит публиковать код, так как это образец Angular 2 Google Map, доступный всем нам и не меняющий ничего такого. Конечно, я проверил простейшую конфигурацию с типизированными значениями и все еще случается. Вот код в любом случае. Шаблон:

<h1>Sample Angular 2 Google Maps App</h1> 
<div class="container"> 
    <div class="row"> 
    <div class="col-md-5"> 
     <section widget class="widget"> 
     <p>Vivamus hendrerit arcu sed erat molestie vehicula....</p> 
     </section> 
    </div> 
    <div class="col-md-7"> 
     <div id="my-google-map"> 
     <sebm-google-map 
      [latitude]="lat" 
      [longitude]="lng" 
      [zoom]="zoom" 
      [disableDefaultUI]="false" 
      [zoomControl]="true"> 
      <sebm-google-map-marker 
      *ngFor="let m of markers; let i = index" 
      (markerClick)="clickedMarker(m.label, i)" 
      [latitude]="m.lat" 
      [longitude]="m.lng" 
      [label]="m.label" 
      [markerDraggable]="false"> 
      </sebm-google-map-marker> 
     </sebm-google-map> 
     </div> 
    </div> 
    </div> 
</div> 

А вот компонент:

import {Component, OnInit, AfterContentInit} from '@angular/core'; 
import {ElementRef, ViewEncapsulation} from '@angular/core'; 
import {GOOGLE_MAPS_DIRECTIVES, 
     GOOGLE_MAPS_PROVIDERS, 
     provideLazyMapsAPILoaderConfig, 
     GoogleMapsAPIWrapper} from 'angular2-google-maps/core'; 

// just an interface for type safety. 
interface Marker { 
    lat: number; 
    lng: number; 
    label?: string; 
} 
interface Bounds { 
    sw: Marker; 
    ne: Marker; 
} 

@Component({ 
    selector: 'myapp', 
    template: require('./dashboard.html'), 
    styles: ['sebm-google-map { height: 100% }', '#my-google-map { height: 600px;}'], 
    directives: [ 
    GOOGLE_MAPS_DIRECTIVES 
    ], 
    encapsulation: ViewEncapsulation.None, 
    providers: [ GOOGLE_MAPS_PROVIDERS, provideLazyMapsAPILoaderConfig({ 
    apiKey: '.... key ....' 
    })], 

}) 

export class Dashboard implements OnInit, AfterContentInit { 
    // GoogleMaps related 
    lat: number = 25.906032; 
    lng: number = -80.255876; 
    zoom: number = 12; 
    latMin: number = 0; 
    latMax: number = 0; 
    lngMin: number = 0; 
    lngMax: number = 0; 
    $el: any; 
    $mapDiv: any; 
    mapPixelDimensions: any; 
    bounds: Bounds; 
    markers: Marker[] = [ 
    { 
     lat: 25.801553, 
     lng: -80.247964, 
     label: '78' 
    },{ 
     lat: 25.810098, 
     lng: -80.240513, 
     label: '66' 
    },{ 
     lat: 25.822982, 
     lng: -80.215868, 
     label: '59' 
    } 
    ]; 

    constructor (
    el: ElementRef) { 
    this.$el = jQuery(el.nativeElement); 
    this.$mapDiv = this.$el.find('#my-google-map'); 
    } 

    ngOnInit() { 
    this.recalculateMapPosition(); 
    } 

    ngAfterContentInit() { 
    this.recalculateMapPosition(); 
    } 

    recalculateMapPosition() { 
    this.mapPixelDimensions = { 
     height: this.$mapDiv.height(), 
     width: this.$mapDiv.width() 
    }; 
    for (var coord of this.markers) { 
     if (this.latMin == 0) { this.latMin = this.markers[0].lat; } 
     if (this.lngMax == 0) { this.lngMax = this.markers[0].lng; } 
     // Test for minimum and maximum latitude 
     if (coord.lat < this.latMin) { this.latMin = coord.lat; } 
     if (coord.lat > this.latMax) { this.latMax = coord.lat; } 
     // same for longitude 
     if (coord.lng < this.lngMin) { this.lngMin = coord.lng; } 
     if (coord.lng > this.lngMax) { this.lngMax = coord.lng; } 
    } 
    this.lat = this.latMin + Math.abs(this.latMax - this.latMin); 
    this.lng = this.lngMin + Math.abs(this.lngMax - this.lngMin); 
    this.bounds = { 
     ne: {lat: this.latMax, lng: this.lngMax}, 
     sw: {lat: this.latMin, lng: this.lngMin} 
    }; 
    this.zoom = this.getZoom(this.bounds, this.mapPixelDimensions.width); 
    console.log('zoom: ', this.zoom); 
    } 

    clickedMarker(label: string, index: number) { 
    console.log(`clicked the marker: ${label || index}`); 
    } 

    getZoom(bounds, dimm) { 
    var GLOBE_WIDTH = 256; // a constant in Google's map projection 
    var west = bounds.sw.lng; 
    var east = bounds.ne.lng; 
    var angle = east - west; 
    if (angle < 0) { 
     angle += 360; 
    } 
    var zoom = Math.round(Math.log(dimm * 360/angle/GLOBE_WIDTH)/Math.LN2); 
    return zoom - 2; 
    } 

} 

Я тестировал его с FireFox 49.0.2 и этого не произошло. Это случилось с 54.0.2840.71 (64-разрядным) Не тестировалось в Safari.