第一种方式：原生JS向html页面添加内容节点元素代码段：

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <script src="https://cdn.staticfile.org/angular.js/1.6.0/angular.min.js"></script>

</head>

<body>

    <div ng-app="myApp" ng-controller="personCtrl">

        <div id="test"></div>

    </div>

    <script>

        var app = angular.module('myApp', []);

        app.controller('personCtrl', function ($scope) {

            $scope.test = '<p><span style="border: 1px solid #000000;"><span style="text-decoration: line-through; font-family: 宋体, SimSun;"><em><strong>少时诵诗书所所所所所所所所所所所所所所所所所所所所所所所</strong></em></span><span style="text-decoration: line-through; font-family: 宋体, SimSun;"><em><strong><span style="text-decoration: line-through; font-family: 宋体, SimSun; border: 1px solid #000000;"></span></strong></em></span></span></p>'

            document.getElementById("test").innerHTML = $scope.test

        });

    </script>

</body>

</html>

第二种方法：angular-sanitize方法向html页面添加内容节点元素代码段：

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<script src="https://cdn.staticfile.org/angular.js/1.4.6/angular.min.js"></script>

<script src="https://cdn.staticfile.org/angular.js/1.5.0-beta.0/angular-sanitize.min.js"></script></head>

<body>

<div ng-app="myApp" ng-controller="myCtrl">

<p ng-bind-html="myText"></p>

</div>

<script>

var app = angular.module("myApp", ['ngSanitize']);

app.controller("myCtrl", function($scope) {

    $scope.myText = "My name is: <h1>John Doe</h1>";

});

</script>

<p><b>注意:</b> 该实例包含了 "angular-sanitize.js" 文件,

该文件移除 HTML 中的危险代码。</p>

</body>

</html>

angularjs中向html页面添加内容节点元素代码段的两种方法的更多相关文章

  1. SpringBoot中使用Spring Data Jpa 实现简单的动态查询的两种方法

    软件152 尹以操 首先谢谢大佬的简书文章:http://www.jianshu.com/p/45ad65690e33# 这篇文章中讲的是spring中使用spring data jpa,使用了xml ...

  2. 将DataTable内容导出到Excel表格的两种方法

    方法一:循环DataTable单元格内容拼接字符串,利用StreamWriter的Write方法将字符串写入Excel文件中 这种方法很实现很简单.拼接字符串时,每个单元格之间添加'\t'(表示一个占 ...

  3. laravel5.5框架中视图间如何共享数据?视图间共享数据的两种方法

    laravel框架中视图间共享数据有两种,一种是用视图门面share()方法实现,另一种是用视图门面composer() 方法实现,那么,两种方法的实现究竟是怎样的呢?让我们来看一看接下来的文章内容. ...

  4. 【get√】golang中实现从腾讯云CVM查询网卡流量的两种方法

    公众号文章链接 主要参考了以下位置的资料: 云服务器监控接口 腾讯云go-sdk example 方法一:使用腾讯云go-sdk go.mod文件中增加这样一行: github.com/tencent ...

  5. js如何实现动态的在表格中添加和删除行？（两种方法）

    js如何实现动态的在表格中添加和删除行?(两种方法) 一.总结 1.table元素有属性和一些方法(js使用) 方法一:添加可通过在table的innerHTML属性中添加tr和td来实现 tab.i ...

  6. Java 获取*.properties配置文件中的内容 ，常见的两种方法

    import java.io.InputStream; import java.util.Enumeration; import java.util.List; import java.util.Pr ...

  7. Java代码中获取配置文件(config.properties)中内容的两种方法

    方法千千万,本人暂时只总结了两种方法. (1)config.properties中的内容如图 在applicationContext.xml中配置 <!-- 引入配置文件 --> < ...

  8. WebGL中添加天空盒的两种方法

    天空盒 的添加可以让模型所在的场景非常漂亮,而其原理也是非常简单的,相信看完下面代码就可以明白了. 说到天空盒的两种方法,倒不如说是两种写法,分别用了纹理加载的两个方法:loadTexture和loa ...

  9. .net中创建xml文件的两种方法

    .net中创建xml文件的两种方法 方法1:根据xml结构一步一步构建xml文档,保存文件(动态方式) 方法2:直接加载xml结构,保存文件(固定方式) 方法1:动态创建xml文档 根据传递的值,构建 ...

随机推荐

  1. 粗粒度（Coarse-grained）vs细粒度（fine-grained）

    在读的一篇文献中关于RDF的描述: As we know, RDF data is a set of triples with the form (subject, property, object) ...

  2. Jquery异步

    一.Jquery向aspx页面请求数据$("#Button1").bind("click", function () { $.ajax({ type: &quo ...

  3. Docker学习笔记_安装和使用Apache

    一.准备 1.宿主机OS:Win10 64位 2.虚拟机OS:Ubuntu18.04 3.账号:docker 二.安装 1.搜索镜像                                  ...

  4. Mac anzhuangxgboost

    2. 从Github库安装XGBoost 第一步, 克隆最新的XGBoost到本地 git clone --recursive https://github.com/dmlc/xgboost 第二步, ...

  5. pip镜像源配置

    #配置文件路径:%HOME%\pip\pip.ini,不存在新建即可 #在 Windows 2000 以上版本里,%HOME% 目录指的是系统盘下的“\Documents and Settings\你 ...

  6. jqgrid扩展 获取表单数据

    $.fn.GetPostData = function () { var data = {}; var k = false; $(this).find(".datacontrol" ...

  7. Jlabel实现内容自动换行

    Jlabel实现内容自动换行 摘自:https://blog.csdn.net/zhhtao89/article/details/50179695   2015年12月04日 21:09:27 阅读数 ...

  8. 跨库连接报错Server 'myLinkedServer' is not configured for RPC

    Solution: Problem is most likely that RPC is not configured for your linked server. That is not a de ...

  9. iPhone的home键进果汁了，按起来粘粘的感觉

    解决办法是按住home键转动一下,再用棉签蘸点水或者酒精都行(注意:水不要太多,不能让水渗进去),用棉签按压home 键多转几圈就好了.

  10. （转）对存储过程进行加密和解密(SQL 2008/SQL 2012)

    原文地址:http://www.cnblogs.com/wghao/archive/2012/12/30/2837642.html 开始: 在网络上,看到有SQL Server 2000和SQL Se ...