在使用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中的更多相关文章

  1. 动态编译添加php模块

    注意:转载请注明出处:http://www.programfish.com/blog/?p=85 在很多时候我们用linux里搭建web服务器的时候会需要编译安装php套件,而在编译安装后可能又会需要 ...

  2. AngularJS如何给动态添加的DOM中绑定事件

    正常情况(即非动态插入 DOM 对象)下,ng-click 这样的指令之所以有效(即点击之后能调用注册在可见作用域里的方法),是因为 angular 在 compiling phase(编译阶段)将宿 ...

  3. angularjs 动态表单, 原生事件中调用angular方法

    1. 原生事件中调用angular方法, 比如 input的onChange事件想调用angular里面定义的方法 - onChange="angular.element(this).sco ...

  4. 重写代码生成器支持模板（多层架构，MVC），多语言c#,java；支持mysql和sqlserver，动态编译

    多年前用过李天平前辈的,自己改过,后来李老师做动软了,不给源码,修改不是很方便.加上我目前需要转java方向,于是决定自己搞.到目前为止花了整整一个星期了,看看目前的成果. 最后是代码工程文件,用c# ...

  5. 既有Nginx重新动态编译增加http2.0模块

    1.HTTP2.0 HTTP2.0相较于http1.x,大幅度的提升了web性能,在与http1.1完全语义兼容的基础上,进一步减少了网络延时.我们现在很多对外的网站都采用https,但是F12一下看 ...

  6. 转： angularjs 指令中动态编译的方法(适用于有异步请求的情况) 内嵌指令无效

    angular的坑很多 例子: 在directive的link中有一个$http请求,当请求完成后根据返回的值动态做element.append('......');这个操作, 能显示没问题,可问题是 ...

  7. .NET中的动态编译

    代码的动态编译并执行是一个.NET平台提供给我们的很强大的工具用以灵活扩展(当然是面对内部开发人员)复杂而无法估算的逻辑,并通过一些额外的代码来扩展我们已有 的应用程序.这在很大程度上给我们提供了另外 ...

  8. angularjs中展示富文本编辑器文本，向DOM中插入元素

    前几天在用textangular富文本编辑器插件时,将存储的文本及格式存储到数据库中,但是从后台接口中再向angular页面插入时却不能执行,即在Angular中操作DOM没有实现,后来查看了一下,操 ...

  9. DOM中的动态NodeList与静态NodeList

    GitHub版本号: https://github.com/cncounter/translation/blob/master/tiemao_2014/NodeList/NodeList.md 副标题 ...

随机推荐

  1. ubuntu14.04LTS 下storm单机版安装配置

    1．下载storm 的安装文件 http://www.apache.org/dyn/closer.cgi/incubator/storm/apache-storm-0.9.2-incubating/a ...

  2. C运行时的数据结构

    本文描述一下:C运行时的数据结构,相关的段,压栈等 unix默认的编译器会将编译生成的文件默认命名为a.out 目标文件和可执行文件可以有几种不同的格式,所有这些不同格式具有一个共同的概念,那就是段. ...

  3. BestRW团队项目创意以及NABCD

    一.写在前面 这次的团队项目我们队选到的是自由选题,与其说是选,不如说是分配.毕竟我们组游戏排名倒数第二···其实当我第一次听说我们队排倒数第二的时候我是有点不爽的,毕竟在这后面能够抽到的题目都是剩下 ...

  4. iOS - OC iOS 开发体系

    1.iOS 开发技术体系 iOS 开发技术体系图: 层级 主要框架 Cocoa Touch UIKit 等 Media Core Graphics .OpenGl ES.Core Animation ...

  5. mysql概要（五）union

    1.union,union all;合并不像表联合那样记录之间交叉组合而是插入新记录的效果 union:有个特性是会去重复,如果两个结果出现相同一条记录会被忽略掉一条. uniion all:将不会出 ...

  6. 刻录DVD_目录

    1.down.52pojie.cn (20160701) (1 in 5) 工具 2.down.52pojie.cn (20160701) (2 in 5) Android VM 6/7 3.down ...

  7. web设计经验<四>设计师必备的20条设计黄金法则

    编者按:以下内容摘自<美国视觉设计学院之完形设计>,新手可以多看这些法则,并运用到你的设计过程中,防止自己做出甲方式审美的作品. 一.必须有一个概念 设计从创意开始.这可能是非常不确定的— ...

  8. poj2546Circular Area（两圆相交面积）

    链接 画图推公式 这两种情况 都可用一种公式算出来 就是两圆都求出圆心角 求出扇形的面积减掉三角形面积 #include <iostream> using namespace std; # ...

  9. Git学习（2）Git 安装

    Windows 平台上安装 在 Windows 平台上安装 Git 同样轻松,有个叫做 msysGit 的项目提供了安装包,可以到 GitHub 的页面上下载 exe 安装文件并运行: 安装包下载地址 ...

  10. 【服务器防护】WEB防护 - WEBSHELL攻击探测【转载】

    原文:http://www.2cto.com/Article/201511/451757.html 1. 什么是webshell?     基于b/s架构的软件部署在Internet上,那么安全性是必 ...