Angular-google-maps: AGM mapClick ($ event) لا يعمل بشكل صحيح

تم إنشاؤها على ٢٤ يوليو ٢٠٢٠  ·  20تعليقات  ·  مصدر: SebastianM/angular-google-maps

لقد أجريت البرنامج التعليمي لبدء AGM: https://angular-maps.com/guides/getting-started/

أنا ركبت:
"@ الزاوي / الأساسية": "~ 10.0.0"
و
"@ agm / core": "^ 3.0.0-beta.0"

في app.component.html أضفت:


في app.component.ts أضفت:
فئة التصدير AppComponent {
العنوان = 'gbis' ؛
خط العرض = 51.678418 ؛
lng = 7.809007 ؛

mapClick(e) {
    console.log(e);
}

}

في app.component.css أضفت:
agm- خريطة {
الارتفاع: 300 بكسل ؛
}

عندما أقوم بتشغيل هذا التطبيق ، تعمل الخريطة ولكن إذا نقرت على الخريطة في خريطة وظيفة ملف TS ، انقر (هـ) أستقبل e = "c". لا توجد إحداثيات مستلمة من المعلمة e.

الرجاء المساعدة!

urgent bug

التعليق الأكثر فائدة

كحل بديل ، يمكنك إضافة مستمع إلى مثيل خريطة google

<agm-map [latitude]="position.lat"
         [longitude]="position.lng"
         [zoom]="zoom"
         (mapReady)="mapReadyHandler($event)">
</agm-map>
public mapReadyHandler(map: google.maps.Map): void {
  this.map = map;
  this.mapClickListener = this.map.addListener('click', (e: google.maps.MouseEvent) => {
    this.zone.run(() => {
      // Here we can get correct event
      console.log(e.latLng.lat(), e.latLng.lng());
    });
  });
}

public ngOnDestroy(): void {
  if (this.mapClickListener) {
    this.mapClickListener.remove();
  }
}

ال 20 كومينتر

ETA على هذا الإصلاح؟ أو الحل؟

واجهت نفس المشكلة بالضبط.

هل يمكن لأي شخص إصلاح هذه المشكلة؟

نفس المشكلة ، هل يجب عليك استخدام إصدار أقدم لحل هذه المشكلة؟

هل يمكن لأي شخص إصلاح هذه المشكلة؟

هل يمكن لأي شخص إصلاح هذه المشكلة؟

أقترح استخدام إصدار أقدم في الوقت الحالي ، نظرًا لأن هذا الخطأ بالغ الأهمية ، مما يلغي التفاعل الأساسي مع الخريطة

هل يمكن لأي شخص إصلاح هذه المشكلة؟

أقترح استخدام إصدار أقدم في الوقت الحالي ، نظرًا لأن هذا الخطأ بالغ الأهمية ، مما يلغي التفاعل الأساسي مع الخريطة

نعم ، الإصدار السابق 1.1.0 (منذ 8 أشهر) يعمل بشكل جيد.

إصلاح بسيط في # 1847 ، في انتظار مراجعة من SebastianM

أواجه نفس المشكلة. يؤدي $ event في mapClick إلى إرجاع سلسلة "c". أي فكرة متى سيتم إصلاح هذا؟ أي حل بخلاف التحول إلى إصدار أقدم؟

كحل بديل ، يمكنك إضافة مستمع إلى مثيل خريطة google

<agm-map [latitude]="position.lat"
         [longitude]="position.lng"
         [zoom]="zoom"
         (mapReady)="mapReadyHandler($event)">
</agm-map>
public mapReadyHandler(map: google.maps.Map): void {
  this.map = map;
  this.mapClickListener = this.map.addListener('click', (e: google.maps.MouseEvent) => {
    this.zone.run(() => {
      // Here we can get correct event
      console.log(e.latLng.lat(), e.latLng.lng());
    });
  });
}

public ngOnDestroy(): void {
  if (this.mapClickListener) {
    this.mapClickListener.remove();
  }
}

يمكن لأي شخص حل هذه المشكلة؟

أقترح استخدام إصدار أقدم في الوقت الحالي ، حيث أن هذا الخطأ أمر بالغ الأهمية ، مما يؤدي إلى رفض التفاعل الأساسي مع الخريطة

نعم ، الإصدار الأقدم 1.1.0 (منذ 8 أشهر) يعمل بشكل جيد.

إذا كان يعمل مع الإصدار 1.1.0 ، فاستخدم الأمر npm i @ agm /

متى سيتم الافراج عن هذا؟

تواجه نفس المشكلة على "@ agm / core": "^ 3.0.0-beta.0"

@ egorkel-da14 أحاول الحل البديل ولكني أتلقى هذه الرسالة:
Uncaught TypeError: Cannot read property 'run' of undefined
عند الاتصال بـ this.zone.run(...)

نسيت شيئا ما هنا؟

تحديث: يبدو أنه يمكنني الحصول على الإحداثيات عند حذف هذا السطر:

    public mapReadyHandler(map: google.maps.Map): void {
        this.map = map;
        this.mapClickListener = this.map.addListener('click', (e: google.maps.MouseEvent) => {
            console.log(e.latLng.lat(), e.latLng.lng());
        });
    }

@ egorkel-da14 أحاول الحل البديل ولكني أتلقى هذه الرسالة:
Uncaught TypeError: Cannot read property 'run' of undefined
عند الاتصال بـ this.zone.run(...)

نسيت شيئا ما هنا؟

تحديث: يبدو أنه يمكنني الحصول على الإحداثيات عند حذف هذا السطر:

    public mapReadyHandler(map: google.maps.Map): void {
        this.map = map;
        this.mapClickListener = this.map.addListener('click', (e: google.maps.MouseEvent) => {
            console.log(e.latLng.lat(), e.latLng.lng());
        });
    }

نعم :)
تحتاج إلى حقن خدمة NgZone للمنشئ

constructor(private zone: NgZone) {}

أنت بحاجة إلى هذا الخط للعمل المناسب لاكتشاف التغيير الزاوي (لتحديث العرض المناسب)
تضمين التغريدة

استدعاء event.latLng.lat () يعمل
markerDragEnd ($ event: any) {
console.log ($ event.latLng.lat ()، $ event.latLng.lng ()) ؛
}

لدي نفس المشكلة مع وظيفة addPin ، لكني بحاجة إلى استخدام الإصدار 3.0.0 للحصول على ترجمة للخرائط حسب لغة المستخدم. لذلك أحتاج إلى معرفة الإصدار مع الترجمة وإضافة وظيفة الدبوس التي تم نشرها في وقت سابق أم لا؟ (لأن الترجمة في الإصدار 1.1.0 ما زالت غير متوفرة)

يمكن لأي شخص حل هذه المشكلة؟

أقترح استخدام إصدار أقدم في الوقت الحالي ، حيث أن هذا الخطأ أمر بالغ الأهمية ، مما يؤدي إلى رفض التفاعل الأساسي مع الخريطة

نعم ، الإصدار الأقدم 1.1.0 (منذ 8 أشهر) يعمل بشكل جيد.

إذا كان يعمل مع الإصدار 1.1.0 ، فاستخدم الأمر npm i @ agm /

مع Angular 10؟

كحل بديل ، يمكنك إضافة مستمع إلى مثيل خريطة google

<agm-map [latitude]="position.lat"
         [longitude]="position.lng"
         [zoom]="zoom"
         (mapReady)="mapReadyHandler($event)">
</agm-map>
public mapReadyHandler(map: google.maps.Map): void {
  this.map = map;
  this.mapClickListener = this.map.addListener('click', (e: google.maps.MouseEvent) => {
    this.zone.run(() => {
      // Here we can get correct event
      console.log(e.latLng.lat(), e.latLng.lng());
    });
  });
}

public ngOnDestroy(): void {
  if (this.mapClickListener) {
    this.mapClickListener.remove();
  }
}

شكرًا جزيلاً على هذا الرمز ، إنه مفيد جدًا ، أتمنى لك يومًا سعيدًا

هل كانت هذه الصفحة مفيدة؟
0 / 5 - 0 التقييمات