点击AngularJS动态iframe

AngularJS dynamic iframe on click

本文关键字：iframe 动态 AngularJS 点击      更新时间：2023-09-26

我有一个输入框，需要加载一个在输入中键入的url。然后单击按钮后，我需要iframe来加载页面。我试着在控制器中添加$sce，如果它只是硬编码的，它就可以工作。这是我目前掌握的代码。

带按钮的输入框

    <input type="text" class="form-control" id="basic-url" aria-describedby="basic-addon3" ng-model="url" />
          <span class="input-group-btn">
            <button class="btn btn-primary btn-lg" type="button" ng-click="go(url)">Go!</button>
         </span>

控制器

app.controller('browser', [
'$scope',
'$http',
'contentService',
'arrayService',
'ngAudio',
'$sce',
function($scope, $http, contentService, arrayService, ngAudio, $sce) {
    contentService.then(function(data) {
        $scope.data = data; // access all data
        $scope.links = $sce.trustAsResourceUrl("http://www.yelp.com/");
        $scope.go = function(url){
           $scope.links = url;
           console.log('links', $scope.links);
            return $scope.links;
        };

        });
    }
]);

我制作了一支钢笔让您开始使用，我会根据需要进行更新。如果你能提供你所拥有的iFrame，我会更新。

function exampleCtrl() {
  var vm = this;
  vm.go = go;
  vm.url = 'type here';
  function go(url) {
    console.log(url);
  }
}
angular
  .module('app', [])
  .controller('exampleCtrl', exampleCtrl);

<div class="container" ng-app="app" ng-controller="exampleCtrl as vm">
  <input type="text" ng-model="vm.url" />
  <button ng-click="vm.go(vm.url)">Go!</button>
</div>
相关文章：