2016-12-01 5 views
0

Я пытаюсь использовать BingMaps в Aurelia SPA. Что я сделал, так это добавить тег скрипта BingMaps в раздел «Голова» на странице «Индекс». как это:Как подождать BingMaps для загрузки в Aurelia

<head> 
    <meta charset="utf-8"> 
    <script type='text/javascript' src='http://www.bing.com/api/maps/mapcontrol?branch=release'></script> 
</head> 

Тогда у меня есть шаблон карты и контроллер карты, как это:

map.html

<template> 
    <div id='mainMap' style='width: 100vw; height: 100vh;'></div> 
</template> 

map.ts

export class Map 
{ 
    map:Microsoft.Maps.Map; 

    attached(){ 
     this.map = new Microsoft.Maps.Map('#mainMap', {credentials: myKey}); 
     this.map.setView({center: new Microsoft.Maps.Location(45.093,14.114), zoom:15}); 
    } 
} 

Теперь я m с помощью Aurelia Typcript WebPack Skeleton для моего приложения. Если я запустил приложение и нажал ссылку меню «Карта», я создал все правильно, и отобразилась карта. Но если я прес Обновить в браузере Aurelia бросает исключение:

Unhandled rejection TypeError: Cannot read property 'prototype' of null at k (https://www.bing.com/mapspreview/sdk/mapcontrol?branch=release:11:7096) at h (https://www.bing.com/mapspreview/sdk/mapcontrol?branch=release:11:6285) at e (https://www.bing.com/mapspreview/sdk/mapcontrol?branch=release:11:1106) at t.l [as instance] (https://www.bing.com/mapspreview/sdk/mapcontrol?branch=release:11:161) at h (https://www.bing.com/mapspreview/sdk/mapcontrol?branch=release:11:6042) at e (https://www.bing.com/mapspreview/sdk/mapcontrol?branch=release:11:1106) at t.l [as instance] (https://www.bing.com/mapspreview/sdk/mapcontrol?branch=release:11:161) at new Microsoft.Maps.Map (https://www.bing.com/mapspreview/sdk/mapcontrol?branch=release:13:4304) at Map.attached (http://localhost:9000/app.bundle.js:28421:20) at Controller.attached

Как как сценарий карты не был загружен до Прикрепленный метод в контроллере карт запускается. Как я могу сказать Aurelia дождаться загрузки сценария карт перед запуском метода Attached?

+1

Это не ответ на вашу проблему, просто лучшая практика. Вы не должны использовать заглавные буквы в именах файлов. Я предлагаю изменить 'Map.html' на' map.html' и 'Map.ts' на' map.ts'. Это для лучшей совместимости. Aurelia также делает некоторые предположения о соглашениях об именах, и вполне возможно, что заглавные буквы могут иногда влиять на функциональность. – LStarky

+0

Согласен, изменен. – Luka

ответ

1

У вас есть два варианта. Первый заключается в том, чтобы добавить параметр обратного вызова к URL-адресу сценария карты и передать имя функции для вызова при загрузке сценария карты. Например:

<script type='text/javascript' src='http://www.bing.com/api/maps/mapcontrol?callback=LoadMap' async defer></script> 

Обратите внимание, что вам не нужно утверждать, вы хотите ветвь релиза, то есть ветвь по умолчанию контрольных карт нагрузки.

Второй вариант немного беспорядочен, но помог другим, кто не хочет использовать метод обратного вызова. Этот метод состоит из мониторинга пространства имен Microsoft.Maps и ожидания до его появления. Это можно сделать с помощью тайм-аутов. Например:

function LoadMap(){ 
    if(typeof Microsoft !== undefined && typeof Microsoft.Maps !== undefined){ 
     //Map API available add your map load code. 
    } else { 
     setTimeout(LoadMap, 100); 
    } 
} 
+0

Спасибо. это будет делать – Luka

 Смежные вопросы

  • Нет связанных вопросов^_^