代码:

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>angularjs嵌入html</title>
</head>
<body ng-app="app" ng-controller="MainCtrl"> <div ng-bind-html="someText"></div> <script src="./assets/angular/angular.min.js"></script>
<script>
angular
.module('app', [], function () { })
.controller('MainCtrl', function ($scope, $sce) {
$scope.someText = $sce.trustAsHtml('<div style="color: red;">hello, world</div>');
});
</script>
</body>
</html>

运行结果:

angularjs通过ng-bind-html指令和$sce服务绑定html的更多相关文章

  1. angular中的ng-bind-html指令和$sce服务

    angular js的强大之处之一就是他的数据双向绑定这一牛B功能,我们会常常用到的两个东西就是ng-bind和针对form的ng-model.但在我们的项目当中会遇到这样的情况,后台返回的数据中带有 ...

  2. 前端MVC学习总结(二)——AngularJS验证、过滤器、指令

    一.验证 angularJS中提供了许多的验证指令,可以轻松的实现验证,只需要在表单元素上添加相应的ng属性,常见的如下所示: <input Type="text" ng-m ...

  3. 前端MVC学习笔记(二)——AngularJS验证、过滤器、指令

    一.验证 angularJS中提供了许多的验证指令,可以轻松的实现验证,只需要在表单元素上添加相应的ng属性,常见的如下所示: <input Type="text" ng-m ...

  4. AngularJS开发指南4:指令的详解

    指令是我们用来扩展浏览器能力的技术之一.在DOM编译期间,和HTML元素关联着的指令会被检测到,并且被执行.这使得指令可以为DOM指定行为,或者改变它. AngularJS有一套完整的.可扩展的.用来 ...

  5. ng之自定义指令

    最近开始研究并使用angular,今天就来简单讲讲对于ng中自定义指令的一下使用心得吧! 相信用过ng的人都对ng中的指令有所了解,指令,我将其理解为AngularJS操作HTML element的一 ...

  6. 【AngularJS学习笔记】01 指令、服务和过滤器

    AngularJS 指令是扩展的 HTML 属性,带有前缀 ng-. 比如: ng-app 指令初始化一个 AngularJS 应用程序.注意ng-app一般为空,如果值不为空,就得加这样一句代码va ...

  7. angularJS中如何写自定义指令

    指令定义 对于指令,可以把它简单的理解成在特定DOM元素上运行的函数,指令可以扩展这个元素的功能 例如,ng-click可以让一个元素能够监听click事件,并在接收到事件的时候执行angularJS ...

  8. AngularJS高级程序设计读书笔记 -- 指令篇 之 内置指令

    1. 内置指令(10-12 章) AngularJS 内置超过 50 个内置指令, 包括 数据绑定,表单验证,模板生成,时间处理 和 HTML 操作. 指令暴露了 AngularJS 的核心功能, 如 ...

  9. 【转载】AngularJS 用$sce服务来过滤HTML标签,解决无法正确显示后台传递的html标签

    angular js的强大之处之一就是他的数据双向绑定这一牛B功能,我们会常常用到的两个东西就是ng-bind和针对form的ng-model.但在我们的项目当中会遇到这样的情况,后台返回的数据中带有 ...

随机推荐

  1. vscode中自动补全<?php?>

    方法引用自百度知道的一个回答: 但是他这个我用着需要优化一下,我的代码是: "PHP":{ "prefix": "php", "b ...

  2. GIT 安装和配置

    Git(读音为/gɪt/.)是一个开源的分布式版本控制系统,可以有效.高速地处理从很小到非常大的项目版本管理. 一.安装 具体参照 安装 Git ,安装完git之后可以安装客户端工具 tortoise ...

  3. 使用freemarker做邮件发送模板

    1.解析工具类 package com.example.springbootfreemarker.utils; import freemarker.template.Configuration; im ...

  4. SkyWalking系列(一):初探

    SkyWalking已经再微服务商城系列里使用了,本篇将介绍如何再Windows系统下安装并简单使用. 1.下载SkyWaling 本篇测试使用6.0版本:http://skywalking.apac ...

  5. 阿里云虚拟主机安装wordpress,提示连接数据库失败的解决方法

      很多新手在购买的虚拟主机后就开始尝试安装,却发现连接数据库老是出错,不知道什么问题,反复检查了自己填写的数据库连接信息发现也没有问题,这个时候我们似乎就没法了. 但这个其实是后台空间的设置问题,你 ...

  6. [Note] Visual Studio Team Service 中的项目 转到 Git

    Git-tf是微软发布的一个Git工具集的补充,用来让开发人员使用git命令与TFS交互,当然现在VSTS已经直接支持git了,现在讲讲以前用了VSTS的老项目如何转到git,保留所有的change ...

  7. Redis开发与运维:数据迁移

    问题 最近项目重构,提前想把一台上的redis实例转移到另一台redis实例上. 源redis数据库:阿里云Redis.VPC网络.Server版本2.8.19 目标数据库:阿里云Redis.VPC网 ...

  8. TensorFlow2.0(六):Dataset

    .caret, .dropup > .btn > .caret { border-top-color: #000 !important; } .label { border: 1px so ...

  9. 从 JVM 视角看看 Java 守护线程

    Java 多线程系列第 7 篇. 这篇我们来讲讲线程的另一个特性:守护线程 or 用户线程? 我们先来看看 Thread.setDaemon() 方法的注释,如下所示. Marks this thre ...

  10. GDB使用总结

    1. GDB概述 GNU发布的调试器,可以查看程序如何运行或崩溃时的状态. 主要功能: 启动程序,可以按照自定义的要求运行程序. 可让被调试的程序在你所指定的断点处停住. 当程序被停住时,可以检查此时 ...