AngularJs与iframe结合使用

Question

为什么这个 jsfiddle不能正常工作？我无法获取videoId的值。如果我从模块中删除ngRoute，则它可以正常工作。

- ARV

---

你没有在任何地方定义ngRoute。 - B Cotter

@BCotter ngRoute是一个模块，来自于angular.route.js文件。 - ARV

angular-route.min.js的链接显示“404 Not Found”。 - EpokK

@EpokK 我的本地机器上有这个文件，你能告诉我如何将它添加到这个 fiddle 中吗？我对 jsfiddle 不太熟悉。谢谢。 - ARV

Answer 1

你需要像这样使用ng-src：

<div ng-controller="AppController">
    <h1>{{videoID}}</h1>
    <iframe class="youtube-player" type="text/html" width="auto"
    height="auto" ng-src="{{videoID}}"
    allowfullscreen="" frameborder="0"> </iframe>
</div>

and

var app = angular.module('my-app', []);
app.controller('AppController', function ($scope, $sce) {  
    $scope.videoID = $sce.trustAsResourceUrl('http://www.youtube.com/embed/C0DPdy98e4c');
});

请参阅这份文档。

- EpokK

---

我也尝试了那个，但它没有起作用，我的主要问题是 ngRoute，我必须使用它来进行视图路由。 - ARV

我尝试使用 $scope.videoID = $sce.trustAsResourceUrl('C0DPdy98e4c');，但它没有起作用，然后我使用了 $sce.trustAsResourceUrl("http://www.youtube.com/embed/C0DPdy98e4c");，然后它就可以了。我不知道为什么只有 ID 不起作用，但我接受你的答案。 - ARV

仅使用ID无法工作，因为它不是URL。 - Ryan Schumacher