AngularJS中播放音频audio

一般情况下对于audio标签,angularjs是不支持的。

用过滤器可以解决这个问题。

myModule.filter(‘trustUrl‘,function($sce){
        return function (input) {
            return $sce.trustAsResourceUrl(input);
        }
});

myModule.controller(‘myController‘,function($scope){  //组装chat的信息  ...

  //播放  $scope.playAudio = function(id){    document.getElementById(id).play();  }});

在页面中使用:

<audio ng-src="{{chat.audio|trustUrl}}" id="{{chat.id}}"></audio><span ng-click="playAudio(chat.id)">点击播放</span>
时间: 2024-10-01 10:25:25

AngularJS中播放音频audio的相关文章

Html5之高级-5 HTML5音频处理(在H5中播放音频、编程实现音频播放器)

一.在HTML5中播放音频 audio 元素 - audio元素可以实现在HTML页面中嵌入音频内容,该元素的属性可以设置是否自动播放.预加载及循环播放等 - audio元素提供了播放.暂停和音量控件来控制音频 - 使用audio元素提供三种音频格式的文件:MP3.Ogg.Wav - MP3: 采用mpeg音频解码器 - Ogg: 采用ogg音频解码器 - Wav: 采用wav音频解码器 - 语法结构 audio 属性 - audio 元素支持以下属性 - src: 指定播放文件的URL,可通过

实验6 在应用程序中播放音频和视频

实验报告 课程名称 基于Android平台移动互联网开发 实验日期 4月15日 实验项目名称 在应用程序中播放音频和视频 实验地点 S3002 实验类型 □验证型    √设计型    □综合型 学  时 一.实验目的及要求(本实验所涉及并要求掌握的知识点) 实现在应用程序中处理音频和视频. [要求] 1) 实现播放音频,音频播放控制: 2) 实现播放视频,视频播放控制: 3) 使用Service服务播放项目源文件中的音乐. 二.实验环境(本实验所使用的硬件设备和相关软件) (1)PC机 (2)

实验六 在应用程序中播放音频和视频

实验报告 课程名称 基于Android平台移动互联网开发 实验日期 2016年4月15日 实验项目名称 在应用程序中播放音频和视频 实验地点 S30010 实验类型 □验证型    √设计型    □综合型 学  时 2 一.实验目的及要求(本实验所涉及并要求掌握的知识点) 1.实现在应用程序中处理音频和视频. 2.实现播放音频,音频播放控制: 3. 实现播放视频,视频播放控制: 4. 使用Service服务播放项目源文件中的音乐. 二.实验环境(本实验所使用的硬件设备和相关软件) (1)PC机

实验6 在应用程序中播放音频和视屏

实验报告 课程名称 基于Android平台移动互联网开发 实验日期 4.15 实验项目名称 在应用程序中播放音频和视屏 实验地点 S3010 实验类型 □验证型    √设计型    □综合型 学  时 1学时 一.实验目的及要求(本实验所涉及并要求掌握的知识点) 实现在应用程序中处理音频和视频 实现播放音频,音频播放控制 实现播放视屏,视屏播放控制 使用service服务播放项目原文件的音乐 二.实验环境(本实验所使用的硬件设备和相关软件) (1)PC机 (2)操作系统:Windows XP

在浏览器中播放音频文件的兼容性问题

来源:http://blog.sina.com.cn/s/blog_96ae64bd0100zk9r.html 下面谈谈本人在html中插入音频文件,经过我的本地测试总结的一些问题(播放mp3文件): 1.<embed type="audio/mp3" src="" autostart=true  loop=false></embed>    问题:IE8上正常(通过media player插件来播放)但在IE6和IE7上不会播放      

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="{

angularjs中动态为audio绑定src问题总结

先上代码 <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

【Android】播放音频的几种方式介绍

接下来笔者介绍一下Android中播放音频的几种方式,android.media包下面包含了Android开发中媒体类,当然笔者不会依次去介绍,下面介绍几个音频播放中常用的类: 1.使用MediaPlayer播放音频 MediaPlayer的功能很强大,下面附上一张该类封装音频的生命周期图: MediaPlayer支持AAC.AMR.FLAC.MP3.MIDI.OGG.PCM等格式,MediaPlayer可以通过设置元数据和播放源来音频. 1.1播放Raw文件夹下面音频的元数据 //直接创建,不

【转】Android播放音频MediaPlayer的几种方式介绍

接下来笔者介绍一下Android中播放音频的几种方式,android.media包下面包含了Android开发中媒体类,当然笔者不会依次去介绍,下面介绍几个音频播放中常用的类: 1.使用MediaPlayer播放音频 MediaPlayer的功能很强大,下面附上一张该类封装音频的生命周期图: MediaPlayer支持AAC.AMR.FLAC.MP3.MIDI.OGG.PCM等格式,MediaPlayer可以通过设置元数据和播放源来音频. 1.1播放Raw文件夹下面音频的元数据 //直接创建,不