大佬教程收集整理的这篇文章主要介绍了深究AngularJS――$sce的使用，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
版权声明：博主地址：http://blog.csdn.net/zcl_love_wx
为什么要要$sce？因为AngularJS里好些地方，比如路径默认是个字符串，不会认为是路径，从而访问不到我们需要的东西，那么我们就可以通过$sce告诉angualrJS这个路径，这样是很安全滴。它有以下几种：
$sce.trustAs(type,name); $sce.trustAsUrl(value); $sce.trustAsHtml(value); $sce.trustAsResourceUrl(value); $sce.trustAsJs(value);
<html> <head> <Metacharset="utf-8"> <scriptsrc="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> </head> <body> <divng-app="myApp"ng-controller="myCtrl"> 第一种方式：<br/> 有$sce处理：<audiong-src="{{sceControl(formData.mediaUrl)}}"controls="controls">您的浏览器不支持html5</audio><br/> 无$sce处理：<audiong-src="{{formData.mediaUrl}}"controls="controls">您的浏览器不支持html5</audio><br/><br/> 第二种方式：<br/> <audiong-src="{{data.url}}"controls="controls">您的浏览器不支持html5</audio> </div> <script> varapp=angular.module('myApp',[]); app.controller('myCtrl',function($scope,$sce){ //第一种方式数据源 $scope.formData={ "name":"视频","mediaUrl":"http://res.audiogroup.cn/res/upload/agx_ims_creative/audio/20160307/bpryk96.mp3"//视频路径 }; $scope.sceControl=$sce.trustAsResourceUrl;//第一种处理方式 //第二种方式数据源 $scope.data={ "name":"视频","url":"http://res.audiogroup.cn/res/upload/agx_ims_creative/audio/20160307/bpryk96.mp3"//视频路径 }; $scope.data.url=$sce.trustAsResourceUrl($scope.data.url);//第二种处理方式 }); </script> </body> </html>
<body>
<divng-app="myApp"ng-controller="myCtrl">
未处理的：
<divng-repeat="iteminformData">
{{item.name}}:{{item.htmlVal}}
</div>
<br/>处理过的：<buttonng-click="look()">查看处理结果</button>
<divng-repeat="itemindata">
{{item.name}}:<png-bind-html="item.htmlVal"></p>
</div>
</div>
<script>
varapp=angular.module('myApp',$sce){
//未处理数据源
$scope.formData=[
{"name":"张春玲","htmlVal":"我是<spanstyle='color:red;'>张春玲<span>"},{"name":"sb","htmlVal":"我是<spanstyle='color:red;'>sb<span>"}
];
//处理结果
$scope.look=function(){alert
$scope.data=[
{"name":"张春玲","htmlVal":"我是<spanstyle='color:red;'>sb<span>"}
];
for(vari=0;i<$scope.data.length;i++){
$scope.data[i].htmlVal=$sce.trustAsHtml($scope.data[i].htmlVal);
}
};
});
</script>
</body>以上是大佬教程为你收集整理的深究AngularJS――$sce的使用全部内容，希望文章能够帮你解决深究AngularJS――$sce的使用所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。