ANGULARJS 动态编译添加到dom中
在使用angularjs 时,希望通过动态构建angular模版,再通过angular进行展示。
使用 方法如下:
<html ng-app="app"> <head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> <script src="assets/angular.min.js"></script>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/handlebars.min.js"></script>
<script src="assets/Handlebars.helper.js"></script> <script >
var app=angular.module("app",[]);
app.controller('ctrl', ['$scope','$compile',function($scope,$compile){
$scope.userName='RAY';
$scope.test = function test(){
console.log('你好:' +$scope.userName);
} //通过$compile动态编译html
var html="<button ng-click='test()'>{{userName}}</button>";
var template = angular.element(html);
var mobileDialogElement = $compile(template)($scope);
angular.element(document.body).append(mobileDialogElement); }]); </script>
</head> <body ng-controller="ctrl"> </body>
</html>
var html="<button ng-click='test()'>{{userName}}</button>";
这种代码就是angular模版,通过angularjs的编译器进行编译,就能够访问到angular scope中的对象数据。
ANGULARJS 动态编译添加到dom中的更多相关文章
- 动态编译添加php模块
注意:转载请注明出处:http://www.programfish.com/blog/?p=85 在很多时候我们用linux里搭建web服务器的时候会需要编译安装php套件,而在编译安装后可能又会需要 ...
- AngularJS如何给动态添加的DOM中绑定事件
正常情况(即非动态插入 DOM 对象)下,ng-click 这样的指令之所以有效(即点击之后能调用注册在可见作用域里的方法),是因为 angular 在 compiling phase(编译阶段)将宿 ...
- angularjs 动态表单, 原生事件中调用angular方法
1. 原生事件中调用angular方法, 比如 input的onChange事件想调用angular里面定义的方法 - onChange="angular.element(this).sco ...
- 重写代码生成器支持模板(多层架构,MVC),多语言c#,java;支持mysql和sqlserver,动态编译
多年前用过李天平前辈的,自己改过,后来李老师做动软了,不给源码,修改不是很方便.加上我目前需要转java方向,于是决定自己搞.到目前为止花了整整一个星期了,看看目前的成果. 最后是代码工程文件,用c# ...
- 既有Nginx重新动态编译增加http2.0模块
1.HTTP2.0 HTTP2.0相较于http1.x,大幅度的提升了web性能,在与http1.1完全语义兼容的基础上,进一步减少了网络延时.我们现在很多对外的网站都采用https,但是F12一下看 ...
- 转: angularjs 指令中动态编译的方法(适用于有异步请求的情况) 内嵌指令无效
angular的坑很多 例子: 在directive的link中有一个$http请求,当请求完成后根据返回的值动态做element.append('......');这个操作, 能显示没问题,可问题是 ...
- .NET中的动态编译
代码的动态编译并执行是一个.NET平台提供给我们的很强大的工具用以灵活扩展(当然是面对内部开发人员)复杂而无法估算的逻辑,并通过一些额外的代码来扩展我们已有 的应用程序.这在很大程度上给我们提供了另外 ...
- angularjs中展示富文本编辑器文本,向DOM中插入元素
前几天在用textangular富文本编辑器插件时,将存储的文本及格式存储到数据库中,但是从后台接口中再向angular页面插入时却不能执行,即在Angular中操作DOM没有实现,后来查看了一下,操 ...
- DOM中的动态NodeList与静态NodeList
GitHub版本号: https://github.com/cncounter/translation/blob/master/tiemao_2014/NodeList/NodeList.md 副标题 ...
随机推荐
- Sql 行转列问题总结
行转列问题总结 1.行转列 ---1.最简单的行转列/* 问题:假设有张学生成绩表(tb)如下:姓名 课程 分数张三 语文 74张三 数学 83张三 物理 93李四 语文 74李四 数学 84李四 物 ...
- 行转列:SQL SERVER PIVOT与用法解释
在数据库操作中,有些时候我们遇到需要实现“行转列”的需求,例如一下的表为某店铺的一周收入情况表: WEEK_INCOME(WEEK VARCHAR(10),INCOME DECIMAL) 我们先插入一 ...
- LTE Module User Documentation(翻译4)—— 使用 Fading Trace
LTE用户文档 (如有不当的地方,欢迎指正!) 7 使用 Fading Trace 本节描述如何在 LTE 仿真中使用 fading traces . (1)生成 Fading Traces ...
- shell script的连接符是逗号,不是英文的句号
举个例子: gawk 'BEGIN{ var[ var[ var[ var[ asort(var,test) for(i in test) print ] }' 这时候敲回车就能输出 Index: - ...
- Ext.net 异常统一管理,铥掉可恶的 Request Failure
Ext.net 异常统一管理,铥掉可恶的 Request Failure 看着这样的框框是不是很不爽 灭他.也不难.. .如果全部页面都有继承一个自定义的父类 ..那整个项目代码量就只有几行了.. 单 ...
- 播放列表文件用于HTTP实时流的使用
广告播放清单(Discontinuities): 通常你会想要提供一系列的电影,在每个电影前面显示一些品牌(广告),让用户知道这些电影来自你的特定网站.一种方法是简单地将广告与每部电影合并.但是如果你 ...
- (转)http接口测试——Jmeter接口测试实例讲解
http://my.oschina.net/hellotest/blog/512482
- Java后端开发
Java后端开发 名称 内容 基本框架 Spring.Mybatis Linux服务器 数据库优化 消息服务 rabbitMQ.activeMq rocketMq 缓存服务 memcached ...
- about shell
摘抄 cat 等 cat主要有三大功能:1.一次显示整个文件.$ cat filename2.从键盘创建一个文件.$ cat > filename只能创建新文件,不能编辑已有文件.3.将 ...
- JSON 语法规则详解
JSON 的语法规则十分简单,无论用何种方法总结都只有数条而已,它参考了 C 语言家族的一些习惯,学习起来并不会感到陌生. 回顾JSON 的五点语法 1)- 数组(Array)用方括号("[ ...