Не удалось загрузить URL-адрес google map через Angularjs

Я пытаюсь отправить значение из области $ в переднюю часть. Это URL-адрес от Google. Но похоже, что он забрасывает какую-то ошибку.Не удалось загрузить URL-адрес google map через Angularjs

Здесь у меня есть скриншот с ошибкой.

enter image description here

А вот как мой контроллер выглядит

var module = angular.module('app', ['onsen']); 
    module.controller('ListingMapCtrl', function($scope, $http, $rootScope) { 
    ons.ready(function() { 
        $scope.mapLocation="https://www.google.com/maps/embed/v1/directions?key=MY_KEY&origin=Current+Location&destination="+$rootScope.LatLong; 

     }); 
});

И вот я звоню его:

<iframe ng-src="{{mapLocation}}" frameborder="0" style="border:0" width="100%" height="100%;"></iframe>

ли кто-нибудь еще была такая же проблема? Любой способ исправить проблему?

Вот как мой HTML Head тег выглядит

<html lang="en" ng-app="app"> 
<head> 
    <meta charset="utf-8"> 
    <meta name="apple-mobile-web-app-capable" content="yes"> 
    <meta name="mobile-web-app-capable" content="yes"> 
    <title>Come To Woodstock</title> 

    <link rel="stylesheet" href="lib/onsen/css/onsenui.css"> 
    <link rel="stylesheet" href="styles/onsen-css-components-blue-basic-theme.css"> 
    <link rel="stylesheet" href="styles/app.css"/> 
    <link rel="stylesheet" type="text/css" href="styles/custom.css"> 
    <script src="lib/onsen/js/angular/angular.js"></script>  
    <script src="lib/onsen/js/onsenui.js"></script>  
    <script src="lib/onsen/js/angular/angular-sanatize.min.js"></script> //Script we want to include 

    <script type="text/javascript" src="js/custom.js"></script> 
</head>

источник

2015-04-25 user3201500

Интересно, если проблема связана с тем, как вы используете Onsen (я не уверен, что вы инъекционные эту библиотеку правильно) – sfletche

sfletche спасибо ищет в проблему. Но не могли бы вы объяснить, где я использую это неправильно. Поскольку я новичок в использовании onsen. И до сих пор то, что я делаю, прекрасно работает. Есть ли что-то, что вы можете предложить сделать правильно? – user3201500

прочитать '$ sce' документы, так как это сервис вызывает вопрос – charlietfl

Вы должны пометить URL как безопасный первый, первый впрыснуть ngSanitize в ваше приложение и включить его в HTML (<script src="angular-sanatize.min.js">), и добавить $sce к ваш контроллер. Оттуда вы можете использовать trustAsResourceUrl на своем URL-адресе и использовать его в своем ng-src.

var module = angular.module('app', ['onsen', 'ngSanitize']);  
module.controller('ListingMapCtrl', function($scope, $http, $rootScope, $sce) { 
    ons.ready(function() { 
     $scope.mapLocation = "https://www.google.com/maps/embed/v1/directions?key=MY_KEY&origin=Current+Location&destination="+$rootScope.LatLong; 
     $scope.mapLocationURL = $sce.trustAsResourceUrl($scope.mapLocation); 
    }); 
});

HTML

<iframe ng-src="{{mapLocationURL}}" frameborder="0" style="border:0" width="100%" height="100%;"></iframe>

источник

2015-04-25 21:41:22

его метания ошибка, как: неперехваченным Ошибка: [$ Инжектор: modulerr] Не удалось создать экземпляр модуля приложения из-за: Ошибка: [$ Инжектор: modulerr] Не удалось создать модуль ngSanitize из-за: Ошибка: [$ injector: nomod] Модуль 'ngSanitize' недоступен! Вы либо ошибочно написали имя модуля, либо забыли загрузить его. Если регистрация модуля гарантирует, что вы укажете зависимости в качестве второго аргумента. – user3201500

Пожалуйста, можете ли вы опубликовать информацию о том, как ваши угловые и угловые санации в вашем index.html? –

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

Не удалось загрузить URL-адрес google map через Angularjs

ответ

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