Using angular expression in ng-src with google maps embed api

I try to load a map on each page that is specific to the values ​​from the api, but I get this error message:

Strict contextual escaping prohibits interpolations that combine multiple expressions when a trusted value is required. See http://docs.angularjs.org/api/ng . $ Sce http://errors.angularjs.org/1.2.15/ $ interpolation / noconcat?

Here is the markup:

<div ng-bind-html="trustedHtml" class="col-md-4 map">
    <iframe ng-src="https://www.google.com/maps/embed/v1/placekey=AIzaSyAJ_lVIxNq31PmzRUbMh9JIStQOE4_6-aQ&q='{{event.venue.name}}'"/>
</div>

and here is the controller:

.controller('EventsCtrl', function($scope, EventsFactory, $routeParams, $sce){
    EventsFactory.async().then(function(data){
        $scope.events = data.data;
        $scope.event= findEvent(eventId, $scope.events);
        console.log($scope.event);
        $scope.trustedHtml = $sce.trustAsHtml($scope.event);
+4
source share
1 answer

$sce.trustAsHtml() $sce.trustAsResourceUrl(). URL- $sce.trustAsResourceUrl(). .

iframe src AngularJS

0

Source: https://habr.com/ru/post/1545092/


All Articles