Angular-google-maps: Kesalahan Lazy-maps-api-loader

Dibuat pada 4 Mei 2016  ·  19Komentar  ·  Sumber: SebastianM/angular-google-maps

Halo @sebastian ,

Saya menggunakan angular2-google-maps di ionic2 / angular2 di mana kita membutuhkan peta hanya dalam satu halaman dan itu berfungsi dengan baik juga, tetapi setiap kunjungan berturut-turut ke halaman yang sama memberi saya kesalahan.

You have included the Google Maps API multiple times on this page. This may cause unexpected errors.

Tolong beri tahu saya jika saya melewatkan sesuatu.

Terima kasih

discussion / question

Komentar yang paling membantu

Dalam impor app.module.ts Anda menambahkan:

AgmCoreModule.forRoot({ apiKey: 'xxxxxx', libraries: ['places'] })

(tentu saja Anda dapat menghapus perpustakaan: ['tempat'])

dan kemudian di modul bersama tambahkan:
dalam impor
AgmCoreModule
dan dalam ekspor:
AgmCoreModule

lalu
You have included the Google Maps API multiple times on this page. This may cause unexpected errors. akan hilang

Semua 19 komentar

Dia @ravindranpandu ,

apakah Anda memuat sendiri skrip google maps di mana saja di halaman ini?

Tidak, saya hanya mengimpornya ke file skrip, setiap kali saya mengunjungi halaman itu, tag skrip ditambahkan ke html yang terhubung ke api googlemap.

index_html

Pada gambar terlampir di atas Anda dapat melihat tag script googlemap ditambahkan 7 kali, yang berarti saya telah mengunjungi halaman 7 kali.

@ravindranpandu hmm, dapatkah Anda menunjukkan fungsi bootstrap() ?

Halo @sebastian ,

Untuk mempermudah saya telah membuat aplikasi sampel, Anda dapat melihat masalahnya di aplikasi ionik itu.
https://github.com/ravindranpandu/angular-map

Terima kasih sebelumnya

Cobalah untuk mengunjungi halaman peta lebih dari sekali, Anda akan mendapatkan masalah yang saya bicarakan.

You have included the Google Maps API multiple times on this page. This may cause unexpected errors.

Saya tidak yakin mengapa ini terjadi, beri tahu saya apa yang salah?

Terima kasih

@ravindranpandu baris ini alasannya:
https://github.com/ravindranpandu/angular-map/blob/master/app/pages/map/map.ts#L14

Anda membuat beberapa contoh pemuat peta saat Anda menyertakan ANGULAR2_GOOGLE_MAPS_PROVIDERS di tempat ini.

Anda harus menggunakan ANGULAR2_GOOGLE_MAPS_PROVIDERS dalam metode bootstrap () Anda.

@SebastianM saya sekarang menginisialisasi ANGULAR2_GOOGLE_MAPS_PROVIDERS di penyedia app.ts utama, sekarang berfungsi seperti yang diharapkan, terima kasih atas waktu Anda.

Ini sepertinya juga terjadi ketika saya menggunakan angular2-google-maps dalam modul fitur, bukan modul aplikasi root. Adakah yang bisa mengkonfirmasi?

Dalam impor app.module.ts Anda menambahkan:

AgmCoreModule.forRoot({ apiKey: 'xxxxxx', libraries: ['places'] })

(tentu saja Anda dapat menghapus perpustakaan: ['tempat'])

dan kemudian di modul bersama tambahkan:
dalam impor
AgmCoreModule
dan dalam ekspor:
AgmCoreModule

lalu
You have included the Google Maps API multiple times on this page. This may cause unexpected errors. akan hilang

Teman-teman, ada yang tahu bagaimana sekarang kita bekerja dengan pemuatan lambat?
GOOGLE_MAPS_PROVIDERS tidak digunakan lagi dan kami menggunakan AgmCoreModule yang memuat setiap kali pustaka API saat modul dimuat.

@szykov Solusi untuk menggunakan komponen angular2 ini dalam submodul yang dimuat lambat adalah dengan melakukan apa yang dikatakan @efstathiosntonas

Pertama, di app.module.ts , sertakan api

// app.module.ts
import { AgmCoreModule } from 'angular2-google-maps/core';

//other stuff here

@NgModule({
   bootstrap: [AppComponent],
   declarations: [ //  declarations contains: components, directives and pipes],
   imports: [ // import other modules here
        AgmCoreModule.forRoot({
            apiKey: 'YOUR_KEY'
       })],
   providers: [ // expose our Services and Providers into Angular's dependency injection]
})

Kemudian di dalam submodul Anda, sertakan lagi tetapi tanpa kunci API

// maps.module.ts (submodule)
import { AgmCoreModule } from 'angular2-google-maps/core';

// other stuff

@NgModule({
   imports: [ // other imports here
      AgmCoreModule
   ],
   declarations: [ // Components / Directives / Pipes
      MapComponent
   ]
})

Sekarang akan lambat memuat komponen peta angular2 dan hanya meminta javascript sekali. Saya melakukan ini menggunakan webpack 2 dan berfungsi dengan baik. Terima kasih teman-teman atas kerja bagusnya di sini.

@IAMIAM terima kasih. Salam juga untuk @efstathiosntonas 🥇

jika Anda memanggilnya lagi di suatu tempat di file indeks atau di tempat lain, Anda harus menghapusnya.
Anda hanya perlu memanggilnya sekali dalam proyek Anda.

Hai, teman-teman, ada yang tahu cara menemukan tempat saya menyertakan peta untuk kedua kalinya?
Jika halaman pertama yang saya kunjungi memiliki peta, saya tidak bisa melihatnya. Tetapi jika halaman dengan peta yang saya kunjungi bukan yang pertama, tidak apa-apa.
Terima kasih

Tanpa sampel kode akan sulit membantu Anda @Riasets

Tautan repo: https://github.com/Riasets/test
Maaf untuk kode yang menyebalkan
@IAM

login: [email protected]
kata sandi: test1234

@Riasets Saya kloning dan menjalankan aplikasi Anda, terlihat sangat bagus. Bagi saya, setelah masuk, peta langsung dimuat, dan jika saya mengubah ke halaman lain, peta juga dimuat dengan baik. Saya tidak melihat ada masalah, dapatkah Anda lebih memperjelas?

@IAMtheIAM Halaman login pertama dan halaman peta kedua. Dalam hal ini beban peta. Tetapi jika Anda sudah diotorisasi dan mencoba membuka / home page, misalnya, peta tidak akan dimuat. Atau coba muat ulang halaman dengan peta, itu tidak akan memuat juga. Dan juga Anda dapat melihat di dev tools 2 skrip yang sama dengan google maps

Apakah halaman ini membantu?
0 / 5 - 0 peringkat

Masalah terkait

ostapch picture ostapch  ·  4Komentar

PeterSisovsky picture PeterSisovsky  ·  3Komentar

matishw picture matishw  ·  3Komentar

shedar picture shedar  ·  4Komentar

Halynsky picture Halynsky  ·  3Komentar