示例：

<!DOCTYPE html>

<html ng-app="MyApp">

<head>

    <title>Study 8</title>

    <script type="text/javascript" src="js/angular.js"></script>

</head>

<body>

    <hello>Robin</hello>

    <test-template></test-template>

    <script type="text/javascript">

        var app = angular.module("MyApp", [], function() { });

        app.directive("hello", function() {

            return {

                restrict: 'E',

                template: "<div>Hello,<b ng-transclude></b></div>",

                replace: true,

                transclude : true

            };

        });

        app.directive("testTemplate", function() {

            return {

                restrict: 'E',

                templateUrl: "test.html",

                replace: true

            };

        });

    </script>

    <script type="text/ng-template" id="test.html">

        <div>Test Template</div>

    </script>

</body>

</html>

Angular学习（7）- 模板2的更多相关文章

  1. angular学习笔记(三十)-指令(2)-restrice,replace,template

    本篇主要讲解指令中的 restrict属性, replace属性, template属性 这三个属性 一. restrict: 字符串.定义指令在视图中的使用方式,一共有四种使用方式: 1. 元素: ...

  2. Angular 学习思路

    近些年前端框架非常多,主流的有 Vue.React.Angular 等.我参与的项目中使用较多的是 Vue.因为 Vue 学习难度不大,上手很快,代码简洁,而且使用 Vue 全家桶(Vue + Vue ...

  3. Angular学习资料大全和常用语法汇总（让后端程序员轻松上手）

    前言: 首先为什么要写这样的一篇文章呢?主要是因为前段时间写过一些关于Angualr的相关实战文章,有些爱学习的小伙伴对这方面比较感兴趣,但是又不知道该怎么入手(因为认识我的大多数小伙伴都是后端的同学 ...

  4. angular学习资源

    angular学习资源   angularjs库: https://developers.google.com/speed/libraries/devguide?hl=zh-CN#angularjs ...

  5. angular学习-入门基础

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

  6. angular学习—组件

    组件: vue组件:xxx.vue react组件:xxx.js+xxx.css angular组件:xxx.ts+xxx.css+xxx.html angular的装饰器: @ngModule:an ...

  7. angular学习一框架结构认识

    angular学习所有内容均会与vue以及react框架进行对比. angular学习使用的编译器:webstorm 解决编译器屏蔽node_modules包问题: File-->setting ...

  8. angular学习笔记(三十一)-$location(2)

    之前已经介绍了$location服务的基本用法:angular学习笔记(三十一)-$location(1). 这篇是上一篇的进阶,介绍$location的配置,兼容各版本浏览器,等. *注意,这里介绍 ...

  9. angular学习笔记(三十一)-$location(1)

    本篇介绍angular中的$location服务的基本用法,下一篇介绍它的复杂的用法. $location服务的主要作用是用于获取当前url以及改变当前的url,并且存入历史记录. 一. 获取url的 ...

  10. angular学习笔记(三十)-指令(10)-require和controller

    本篇介绍指令的最后两个属性,require和controller 当一个指令需要和父元素指令进行通信的时候,它们就会用到这两个属性,什么意思还是要看栗子: html: <outer‐direct ...

随机推荐

  1. C++学习笔记3：一些错误

    错误1:执行程序后,控制台闪烁后退出 处理办法: (1)添加头文件:#include <iostream> (2)在程序返回前添加代码: std::cin.clear();//清除错误标志 ...

  2. LeetCode Median of Two Sorted Arrays 找中位数（技巧）

    题意: 给两个有序(升or降)的数组,求两个数组合并之后的中位数. 思路: 按照找第k大的思想,很巧妙.将问题的规模降低,对于每个子问题,k的规模至少减半. 考虑其中一个子问题,在两个有序数组中找第k ...

  3. 【虚拟DOM】√

    深度剖析:如何实现一个 Virtual DOM 算法 为什么虚拟DOM更优胜一筹 新建树,渲染树,新建新树,对比树(算法),最少dom操作的渲染树

  4. web app 变革之rem

    rem这是个低调的css单位,近一两年开始崭露头角,有许多同学对rem的评价不一,有的在尝试使用,有的在使用过程中遇到坑就弃用了.但是我对rem综合评价是用来做web app它绝对是最合适的人选之一. ...

  5. android定时更新文件

    static变量在程序退出时不会清空的,除非系统内存不足以运行其他程序,才会清空.给SD卡上的文件过期时间.可以简单的在给文件命名时后面加个创建时间,在下次访问时判断是否需要更新.比如本来文件名是 i ...

  6. ARM异常中断处理

    ARM异常中断处理 在ARM体系中,通常有以下3种方式控制程序的执行流程: 在正常程序执行过程中,每执行一条ARM指令,程序计数器寄存器(PC)的值加4个字节:每执行一条Thumb指令,程序计数器寄存 ...

  7. [转载] Python 列表(list)、字典(dict)、字符串(string)常用基本操作小结

    创建列表 sample_list = ['a',1,('a','b')] Python 列表操作 sample_list = ['a','b',0,1,3] 得到列表中的某一个值 value_star ...

  8. linux信号处理及libcurl的坑

    前言:     最近有个项目, 需要访问第三方服务. 该服务是通过http的形式访问的, 为了安全和加密, 对方提供了一个加密用的C/C++库, 用于对参数进行处理.  鉴于此, 选用了C/C++语言 ...

  9. UVa 489 HangmanJudge --- 水题

    UVa 489 题目大意:计算机给定一个单词让你猜,你猜一个字母,若单词中存在你猜测的字母,则会显示出来,否则算出错, 你最多只能出错7次(第6次错还能继续猜,第7次错就算你失败),另注意猜一个已经猜 ...

  10. 使用grep恢复被删除文件内容【转】

    http://www.cnblogs.com/ggjucheng/archive/2012/10/07/2714311.html Unix/Linux下,最危险的命令恐怕就属rm命令了,每次在root ...