Question

我创建了以下AngularJS指令来嵌入youtube视频：

// A Simple youtube embed directive
.directive('youtube', function() {
  return {
    restrict: 'EA',
    scope: { code:'=' },
    replace: true,
    template: '<div style="height:400px;"><iframe style="overflow:hidden;height:100%;width:100%" width="100%" height="100%" src="http://www.youtube.com/embed/{{code}}" frameborder="0" allowfullscreen></iframe>'
  };
});

当我从模板<youtube code="r1TK_crUbBY"></youtube>中调用它时，出现以下错误：

错误：[$ interpolate：noconcat]插值时出错：http://www.youtube.com/embed/ {{code}} Strict Contextual Escaping禁止在需要可信值时连接多个表达式的插值。请参阅http://docs.angularjs.org/api/ng。$ sce

我无法确定{{code}}表达式中指令的错误。

Answer 1

使用Angular 1.2，您需要为src注入$sce service和trustAsResourceURL {/ 1}}。

演示：http://plnkr.co/edit/0N728e9SAtXg3uBvuXKF?p=preview

iframe

另请参阅：Migrate from 1.0 to 1.2和related question。

创建YouTube AngularJS指令

1 个答案: