angular ngSrc不适用于html视频标记

时间:2017-03-02 02:23:20

标签: html angularjs

我正在尝试在上传视频后在网页上加载视频列表:

<div class="form-group">
    <label for="video" class="col-sm-2 control-label control-image">video</label>
    <div class="col-sm-10">
        <ul id="video" ng-repeat="video in vm.item.video" ng-if="vm.item.video.length > 0">
            <li>
                <video width="400" controls><source ng-src="{{vm.uploadDomain + video}}" type="video/mp4">> </video>
                </video>
            </li>
        </ul>
    </div>
</div>

<div class="form-group" ng-class="{'true': '', 'false': 'has-error'}[vm.isValidated('video')]">
    <label class="col-sm-2 control-label control-image">upload</label>
    <div class="col-sm-10">
        <dt-file-uploader  mode="basic"
                          ng-model="vm.item.video"
                          setting="vm.uploader_video"></dt-file-uploader>
    </div>
</div>

但它不起作用,它无法加载这些视频的来源,我该怎么做才能解决这个问题?

1 个答案:

答案 0 :(得分:1)

您可以像这样创建自定义过滤器。

.filter("trustUrl", function($sce) {
    return function(Url) {
        return $sce.trustAsResourceUrl(Url);
    };
});

在src

中的html add过滤器中
<video width="400" controls>
   <source ng-src="{{vm.uploadDomain + video | trustUrl}}" type="video/mp4">
</video>