如何在页面呈现一段html代码段呢?

在textarea中我们这样写:

<textarea name="" id="" cols="30" rows="" ng-model="app.someHtml"></textarea>

也可以这样写:

<div ng-bind-html="app.someHtml"></div>

在controller中大致这样写:

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

app.controller("AppCtrl", function(){
    var app = thisj;
    app.someHtml = '<a href="#">Hello</a>';
})

但,这样会报错。

如何避免呢?

--需要安装angular-sanitize

npm install angular-sanitize

controller中改成这样:

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

app.controller("AppCtrl", function($sce){
    app.someHtml = $sce.trustAsHtml('<a href="#" style="color:red">Hello</a>');
})

$sce用来信任html代码段。好让类似style这种属性生效、被信任。

AngularJS中页面呈现html代码段的更多相关文章

  1. 【转】在Visual Studio中怎样快速添加代码段

    原文网址:http://blog.csdn.net/yl2isoft/article/details/9735527 以前一直只知道,键入prop,再按两次tab键,会生成自动属性代码. 今天闲着无事 ...

  2. vs中的强大的代码段管理

    vs中的代码段管理可以实现大段固定文本的快捷输入,方法: 首先编写.snippet文件如: <?xml version="1.0" encoding="utf-8& ...

  3. AngularJS中页面传参方法

    1.基于ui-router的页面跳转传参 (1) 用ui-router定义路由,比如有两个页面,一个页面(producers.html)放置了多个producers,点击其中一个目标,页面跳转到对应的 ...

  4. 用Handler的post()方法来传递线程中的代码段到主线程中执行

    自定义的线程中是不能更新UI的,但是如果遇到更新UI的事情,我们可以用handler的post()方法来将更新UI的方法体,直接传送到主线程中,这样就能直接更新UI了.Handler的post()方法 ...

  5. VS中常用C#代码段快速输入总结

    转自:https://blog.csdn.net/a980433875/article/details/12231673 Visual Studio 中有很多代码段都可以直接简写然后按TAB快速输入编 ...

  6. 千金良方说:"我现在奉上179341字的MySQL资料包,还来得及吗?有"代码段、附录、和高清图!!"

    上一篇"上发布过"一不小心,我就上传了 279674 字的 MySQL 学习资料到 github 上了",我在更早之前,在微信公众号"老叶茶馆"上发布 ...

  7. WPF自定义RoutedEvent事件代码段

    今天在写东西的时候,发现常用的代码段里没有RoutedEvent的,因此,写了一个代码段,方便以后使用,顺便记录一下,如何做代码段. 1.在项目中新建一个XML文件,将扩展名修改为snippet. 2 ...

  8. linux进程的堆栈空间_代码段(指令,只读)、数据段(静态变量,全局变量)、堆栈段(局部变量)、栈【转】

    转自:http://blog.csdn.net/gongweijiao/article/details/8207333 原文参见:http://blog.163.com/xychenbaihu@yea ...

  9. 【转】linux代码段,数据段,BSS段, 堆,栈

    转载自 http://blog.csdn.net/wudebao5220150/article/details/12947445  linux代码段,数据段,BSS段, 堆,栈 网上摘抄了一些,自己组 ...

随机推荐

  1. AndroidStudio中builde.gradle文件详解

    Android Studio是采用Gradle来构建项目的,一个Android项目中包含两个build.gradle文件,如下图:     (1)最外层目录下build.gradle文件 最外层目录下 ...

  2. hdu3308

    区间合并比较模板的题,就是求一个区间的LCIS 线段树维护左最大LCIS,右最大LCIS,区间LCIS 看代码就行 #include<iostream> #include<cstri ...

  3. 基于GTID环境的数据恢复

    下面说一个线上环境的数据恢复案例,线上环境误操作的事情,随时都有可能发生的,这时候运维DBA或者DBA会想,没人会傻到把数据库干掉的吧?又或者没有会闲得蛋痛删除了几条数据又想恢复这么无聊吧?适适这样的 ...

  4. 创建表空间tablespace,删除

    在plsql工具中执行以下语句,可建立Oracle表空间. /*分为四步 *//*第1步:创建临时表空间  */create temporary tablespace yuhang_temp temp ...

  5. poj 1256 按一定顺序输出全排列(next_permutation)

    Sample Input 3aAbabcacbaSample Output AabAbaaAbabAbAabaAabcacbbacbcacabcbaaabcaacbabacabcaacabacbaba ...

  6. Kubernetes核心概念总结

    目录贴:Kubernetes学习系列 1.基础架构 1.1 Master Master节点上面主要由四个模块组成:APIServer.scheduler.controller manager.etcd ...

  7. 素数筛选-hdu1262

    题目描述: 代码实现: #include<stdio.h> using namespace std; ]; void sieve(int n) { ;i<;i++) prime[i] ...

  8. Redis分布式锁实现方式(附有正解及错误示例)

    一.前言 本文内容主要来自博客:https://wudashan.com/2017/10/23/Redis-Distributed-Lock-Implement/,本文用于归纳总结及笔记用途,如有需要 ...

  9. 蛋疼的mocha库-promise异步测试

    mocha 测试库的使用 错误的处理异步测试 异步当出现断言错误的时候,他会抛出错误,但不会把这次测试当作失败,就是正确的顺利通过测试了,很无语. promise的reject会在then的第二个函数 ...

  10. Luogu

    dalao们的博客a http://hzwer.com   //Orz  %%% https://oi-wiki.org  //Orz https://www.cnblogs.com/-guz/p/9 ...