связывание выражения в директиву ng-src

0

Я пытаюсь загрузить ссылку google map api внутри директивы ng-src, используя этот метод.

<script ng-src="{{trustSrc(vCustom.googleMapApi.src)}}"></script>

в моем контроллере у меня есть..

v.googleMapApi = { src: "https://maps.googleapis.com/maps/api/js?key=" + config.googleApiKey + "&libraries=places" };

$scope.trustSrc = function (src) {
        return $sce.trustAsResourceUrl(src);
    }

иногда это работает, а иногда это не так. Ошибка

ReferenceError: google не определен...

Я пробовал разные способы связать его внутри директивы ng-src, но не успел.

он работает, когда я добавляю этот скрипт <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"></script> но он не работает динамически.. любая помощь??

нет синтаксической ошибки, а мой контроллер - ng-controller="Custom as vCustom"

любые предложения связать его в директиве ng-src?

Теги:

2 ответа

0

Позвольте мне попытаться объяснить сценарий как можно лучше :) Теги <script> оцениваются только один раз в веб-приложении. В отличие от тегов img которые могут иметь атрибут src назначенный различным значениям в приложении, и поэтому переоцениваются. Так что случается, что иногда, когда компилятор добирается до вашего тега скрипта, модель (vCustom.googleMapApi.src) разрешена, поэтому работает нормально, но иногда это происходит не потому, что цикл $digest (цикл событий) в угловом законченный решение модели, и поэтому ключ API не передается правильно в тег скрипта, что приводит к тому, что он не загружает API карт google, а затем, где вы используете карту, он выдает ошибку. В этом случае, чтобы проверить, проверьте тег сценария на хром-отладчике, он не будет иметь правильный ключ API, и скрипт api не будет загружен.


Теперь вопрос в том, что такое решение. Вы можете либо реализовать директиву, которая первоначально разрешает модель APIKey, а затем добавляет тег скрипта в ваш HTML-код или использует твердое кодированное значение, как вы его используете прямо сейчас (я обычно видел его жестко закодированным в большинстве кода и примерах я ' видел). ПРИМЕЧАНИЕ. Даже если вы реализуете такую директиву, вы должны убедиться, что используете карты google api ПОСЛЕ того, как ваша директива выполнена, и вы загрузили карты api.

Надеюсь это поможет.

0

Я думаю, вы пытаетесь лениво загрузить сценарий. Pls смотрит ниже, это может помочь. Как асинхронно загружать карту Google в AngularJS?

  • 0
    нет, сэр, это не так, проблема связана с атрибутом ng-src .. и это работает как обаяние, если я жестко <script src="map.google.apis....."></script> скрипт google maps, т.е. <script src="map.google.apis....."></script>

Ещё вопросы

Сообщество Overcoder
Наверх
Меню