AngularJS之如何传递可以识别HTML标签的文本参数

最新推荐文章于 2021-06-18 11:14:23 发布

spicyboiledfish

最新推荐文章于 2021-06-18 11:14:23 发布

阅读量2.2k

点赞数

CC 4.0 BY-SA版权

分类专栏： Ionic Angular 文章标签：传参识别html标签 angular.js

本文链接：https://blog.youkuaiyun.com/SpicyBoiledFish/article/details/81356117

Ionic 同时被 2 个专栏收录

9 篇文章

订阅专栏

Angular

1 篇文章

订阅专栏

本文介绍了如何在AngularJS中使用$sce.trustAsHtml方法来安全地解析并显示HTML内容。通常AngularJS会将绑定的数据作为纯文本处理，以避免潜在的XSS攻击。通过$sce.trustAsHtml方法可以将带有HTML标签的内容安全地展示出来。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

使用$sce.trustAsHtml方法：

HTML:

<body ng-app="myApp" ng-controller="myCtl">
    <div ng-bind-html="content">
    </div>
</body>

JS：

<script>
    var app = angular.module('myApp', []);
    $scope.content="My name is: <h1>John Doe</h1>";
    app.controller('myCtl',['$scope','$sce', function($scope,$sce){
        $scope.content = $sce.trustAsHtml( $scope.content );
    }]);
</script>

angularjs绑定的数据都会默认以文本的形式输出，并不会去识别html标签，这样做主要是为了防止html标签中的注入攻击，提高了安全性，可以使用$sce.trustAsHtml方法。$sce是angularJS自带的安全处理模块，因此需要$sce.trustAsHtml()方法将数据内容以html的形式解析并返回。