示例：

<!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. jq实现动态添加样式

    <script> $(function(){ $("#list_zlm > a").hover(function(){ $(this).addClass(&quo ...

  2. JAVA学习之Ecplise IDE 使用技巧（1）第一章：我的地盘我做主，工作空间

    麦子学院/Andriod应用开发/第一阶段 Android 学前准备 第三课:Eclipse IDE 使用技巧 由马一鸣老师讲解.感谢麦子学院免费开放这部分视频资源. Eclipse由IBM开发的,2 ...

  3. ubuntu默认root密码

    安装完Kubuntu后一直都是用我的用户名bbking登录, 一直没想到root的问题, 以为每次sudo输入的密码就是我的root密码. 刚才为了修改文件夹的所有者,想使用su root切换到roo ...

  4. ANTLR3完全参考指南读书笔记[04]

    前言 学习框架或第三方库的方法是什么 (1)少量的浏览manual或tutoral,只关注程序所需的特征,再完善其详细内容和特征的认识? (2)花大量的时间研究详细内容,再考虑程序实现? 这是个先有鸡 ...

  5. 66. Plus One

    Given a non-negative number represented as an array of digits, plus one to the number. The digits ar ...

  6. c 函数及指针学习 4

    1数组和指针声明的差别 声明数组:为数组分配内存,为数组名分配内存(指针常量 4个字节) 指针:为指针分配内存(指针变量 4个字节) 1 2 3 4 5 6 7 8 9 10 #include < ...

  7. python--函数--5

    原创博文,转载请标明出处--周学伟http://www.cnblogs.com/zxouxuewei/ 一.什么是函数 我们知道圆的面积计算公式为: S = πr² 当我们知道半径r的值时,就可以根据 ...

  8. wordpress（一）wordpress环境的搭建

    搭建wordpress环境因为自动安装的脚本不提供创建数据库的功能,所以先要创建数据库. 1.使用如下命令创建数据库(都是在已经登陆的mysql界面中的命令) ①CREATE DATABASE 数据库 ...

  9. jQuery中过滤选择器first和first-child的区别

    :first过滤器只匹配第一个子元素,而:first-child过滤器将为每个父元素匹配个子元素. 对于下面html代码: <ul> <li>John</li> & ...

  10. click 绑定（三）防止事件冒泡

     防止事件冒泡 默认情况下,Knockout允许click事件继续在更高一层的事件句柄上冒泡执行.例如,如果你的元素和父元素都绑定了click事件,那当你点击该元素的时候两个事件都会触发的.如果需要, ...