为什么Vimeo iframe在点击页面上的任何位置时会闪烁?

时间:2014-07-27 21:24:29

标签: angularjs angularjs-filter

我创建了一个加载Vimeo iframe的简单过滤器。这是在ng-repeat指令内。一切正常,但每当我点击网页上的任何地方时,iframe都会闪烁。每当我按下textareainput字段中的某个键(发生在“keyup”上)时,也会发生这种情况。这有点奇怪,因为页面上的其他内容都没有闪烁 - 只有包含Vimeo视频的iframe。这是我的代码:

<div ng-app="myApp">
    <div ng-controller="myAppCtrl"> 
        <div ng-repeat="item in items">
            <div id="{{item.video.code}}">{{item.video.code | vimeo}}</div>
        </div>
    </div>
</div>

var myApp = angular.module('myApp', []);

myApp.filter('vimeo', function() {
    return function(vimeoID) {
        var data = '<iframe src="http://player.vimeo.com/video/' + vimeoID + '" width="360" height="270" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen><\/iframe>';
        $('#' + vimeoID).html(data);
    };
});

myApp.controller("myAppCtrl",function($scope){
    // sample data
    var items = [
        {
            text : 'Hello World",
            video : {
                source : 'Vimeo',
                code : '101468694'
            }
        },
        {
            text : 'Hello People",
            video : {
                source : 'Vimeo',
                code : '35375393'
            }
        }
    ];

    $scope.items = items;
});

Any ideas on why this is happening?

1 个答案:

答案 0 :(得分:0)

使用“ ngx-embed-video”

点击here! 这也适用于https://stackblitz.com/edit/ngx-embed-video-example stackblitz.com/ngx-embed-video-example。