如何使用 $sce 服務從 AngularJS 中的變數設定 iFrame 的 src 屬性？

從AngularJS 中的變數設定iFrame src 屬性

要從AngularJS 中的變數設定iframe 的src 屬性，必須將$sce 服務注入到控制器中.

控制器修改

在AppCtrl 中，注入$sce 依賴項：

<code class="js">function AppCtrl ($scope, $sce) {
    // ...
}</code>

然後，在setProject 函數中，使用trustAsResourceUrl 信任URL：

<code class="js">$scope.setProject = function (id) {
    $scope.currentProject = $scope.projects[id];
    $scope.currentProjectUrl = $sce.trustAsResourceUrl($scope.currentProject.url);
}</code>

模板修改

在模板中，在ng-src 屬性中使用currentProjectUrl 變數：

<code class="html"><iframe ng-src="{{currentProjectUrl}}"></iframe></code>

這種方法確保AngularJS 安全地處理URL，並且防止潛在的跨站點腳本漏洞。

以上是如何使用 $sce 服務從 AngularJS 中的變數設定 iFrame 的 src 屬性？的詳細內容。更多資訊請關注PHP中文網其他相關文章！