Question

以下代碼是使用參數的函數。當我提醒變量時，字符串看起來應該如何。

$scope.createMap = function(size,scale,center,zoom,style){ 
    $scope.myMap = "<img ng-src='https://maps.googleapis.com/maps/api/staticmap?size="+size+"&scale="+scale+"&center=IL"+center+"&style="+style+"&zoom="+zoom+"'>"; 
    alert($scope.myMap); 

    return; 
} 

然而，HTML頁面在哪裏，這是綁定到：

<div ng-bind-html="myMap" id="myStaticMap"> 
    MAP GOES HERE 
</div> 

的區域是空的，當我「檢查元素」有<img></img>，所以它註冊它是一個圖像，但空了。

同樣的事情發生在這裏：

$scope.displayPage = function(page){ 
     $scope.siteName = $scope.names[page].PageName; 
     $scope.logo = "<img ng-src='"+$scope.names[page].logo+"'>"; 
     alert($scope.logo); 

     $scope.createMap($scope.names[page].Size,$scope.names[page].Scale,$scope.names[page].Center,$scope.names[page].Zoom,$scope.names[page].Style);} 

其中參數正在使用一點點不同。但是，$scope.logo的警報再一次提醒正確的字符串，但有<img></img>它應該被綁定。 $scope.siteName綁定正常，但是，它不綁定任何HTML。

我使用了sanitize模塊：

var app = angular.module('myApp', ["ngSanitize"]); 

（劇本最後被放置在我的外部引用的列表）

所以我不知道什麼是錯在這裏。

---

更新：所以，我做了以下的答案的建議，當我改變ng-src到src所以這是真棒這是工作。但是，我在我的Web控制檯中收到以下錯誤，任何人都知道爲什麼？我明白了我是使用ng-src或src：

"Error: html.indexOf is not a function htmlParser@http://code.angularjs.org/1.0.3/angular-sanitize.js:205:12 $sanitize@http://code.angularjs.org/1.0.3/angular-sanitize.js:119:1 ngBindHtmlWatchAction@http://code.angularjs.org/1.0.3/angular-sanitize.js:420:1 Yd/this.$gethttps://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:110:371 Yd/this.$gethttps://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:113:360 m@https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:72:452 w@https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:77:463 ye/https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:79:24

var app = angular.module('myApp', ["ngSanitize"]); 
app.controller('customersCtrl', function($scope, $http, $sce) { 

Answer 1

當您從控制器中解析HTML，你必須使用$sce的依賴性和角度，以標記HTML作爲「受信任」：

angular.module("yourModule").controller("yourController", 
    ["$scope", "$sce", function ($scope, $sce) { 
     $scope.displayPage = function(page){ 
     $scope.siteName = $scope.names[page].PageName; 
     $scope.logo = $sce.trustAsHtml("<img ng-src='"+$scope.names[page].logo+"'>"); 
     alert($scope.logo); 
     $scope.createMap($scope.names[page].Size,$scope.names[page].Scale,$scope.names[page].Center,$scope.names[page].Zoom,$scope.names[page].Style);} 
    } 
]);