• angularjs中动态为audio绑定src


    今天在angularjs中用audio的时候碰到的这些问题,查阅http://www.cnblogs.com/rachelanlan/p/3598070.html获得解决,感谢!

    <div class="block_area block_audio" ng-show="model.url">
            <audio controls="controls" ng-click="open()" ng-src="{{model.url}}"></audio>
            <button class="close btn_delete" ng-click="remove()">&times;</button>
    </div>

    按照以往的经验,只要使用 ng-src 捆绑数据就可以了。 但是audio无法正常绑定url数据。

    (省略中间各种尝试,直接上解决办法)

    1,对应得control中添加 $sce

    2,使用$sce.trustAsResourceUrl(捆绑的url)处理,然后进行捆绑就ok啦

    以下是示例代码,供参考

    functionAppCtrl($scope, $sce){// ...
        $scope.setProject =function(id){
          $scope.currentProject = $scope.projects[id];
          $scope.currentProjectUrl = $sce.trustAsResourceUrl($scope.currentProject.url);
    }
    }

    我是这样做的,也可以,你懂的。

    //control 
    var modalInstanceCtrl = function ($scope,  $sce) {
                                $scope.sce = $sce.trustAsResourceUrl;
                                 ....
    }
    
    
    //html
     <div class="block_area block_audio" ng-show="model.url">
            <audio controls="controls" popover-title="{{model.url}}" ng-click="open()" ng-src="{{sce(model.url)}}"></audio>
            <button class="close btn_delete" ng-click="remove()">&times;</button>
    </div>
  • 相关阅读:
    从MANNING抽的新书 免费分享 <算法图解>
    这些天在看的
    创建Spring框架程序初始化的的几种方式
    我在互联网公司的一天
    python文件中 代码的顺序
    分布式事务,两阶段提交协议,三阶段提交协议
    Zookeeper工作原理
    CAP定理
    SpringCloud 架构
    springCloud(一)Erueka工作原理
  • 原文地址:https://www.cnblogs.com/leejersey/p/4756663.html
Copyright © 2020-2023  润新知