iframe中的Angular js scope var值

Question

我正在使用角度js.我有一个控制器"youTubePlayerCtrl",在这个控制器中我有$ scope.videoID,其中包含youtube视频ID.我可以在h1块中的下面的div中获得此值.但是我无法在iframe中获得{{videoID}},任何人都可以帮我解决这个问题.

<div ng-controller="youTubePlayerCtrl">
    <h1>{{videoID}}</h1>
    <iframe class="youtube-player" type="text/html" width="auto"
        height="auto" src="http://www.youtube.com/embed/{{videoID}}"
        allowfullscreen frameborder="0"> </iframe>
</div>

这是错误日志:

[$ interpolate:noconcat] http://errors.angularjs.org/undefined/ $ interpolate/noconcat？p0 = http%3A%2F%2Fwww.youtube.com%2Fembed%2F%7B%7BvideoID%7D%7D出错()http://code.angularjs.org/1.2.0-rc.2/angular.min.js:6:453 at g(http://code.angularjs.org/1.2.0-rc.2 /angular.min.js:69:467)在b.push.compile(http://code.angularjs.org/1.2.0-rc.2/angular.min.js:54:6)at l(http ://code.angularjs.org/1.2.0-rc.2/angular.min.js:47:124)at f(http://code.angularjs.org/1.2.0-rc.2/angular. min.js:41:361)at(http://code.angularjs.org/1.2.0-rc.2/angular.min.js:47:64)at f(http://code.angularjs.org/1.2.0-rc.2/angular.min.js:41:361)在http://code.angularjs.org/1.2.0-rc.2/angular.min .js:40:434 at http://code.angularjs.org/1.2.0-rc.2/angular-route.min.js:7:148 angular.js:7861(匿名函数)

Jsfiddle(不工作)

感谢名单

Answer 1

首先:你需要使用ng-src而不是src@Cherniv在你的问题的评论中建议.在这里阅读更多.

第二:出于安全原因,你无法在源属性中连接URL:你必须在范围变量中连接Javascript中的URL fullURL,然后再连接ng-src="{{fullURL}}".在这里阅读更多.

第三:如果启用了严格上下文转义(SCE) - 并且Angular v1.2默认启用了SCE,则需要将URL列入白名单.在这里和这里阅读更多.