AngularJS动态iframe点击

Question

我有一个输入框，我需要加载一个正在输入中的 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;
        };


        });
    }
]);

Answer 1

我已经创建了pen 来帮助您入门，我会根据需要进行更新。如果你能提供你所拥有的 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>