示例:

<!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. 用NSOperation和NSOperationQueue实现多线程编程

    1.上一讲简单介绍了NSThread的使用,虽然也可以实现多线程编程,但是需要我们去管理线程的生命周期,还要考虑线程同步.加锁问题,造成一些性能上的开销.我们也可以配合使用NSOperation和NS ...

  2. Qt4升级到Qt5

    QtWidgets作为一个独立的模块 例如编译时错误 error: QMainWindow: No such file or directory error: QToolButton: No such ...

  3. 打开office弹出steup error 的解决办法

    找到 C:\Program Files\Common Files\Microsoft Shared\OFFICE12\Office Setup Controller 将这个文件夹删除

  4. 【题解】【BST】【Leetcode】Validate Binary Search Tree

    Given a binary tree, determine if it is a valid binary search tree (BST). Assume a BST is defined as ...

  5. 用jquery将复选框改成单选框

    前提是要包含jquery文件. 相关代码: jQuery(function($) { init_price_checkbox("by_price"); init_price_che ...

  6. selenium Gird

    selenium-server selenium Gird testcase-----------------hub -------------------node1 ---------------- ...

  7. [转载] C++ typedef 用法详解

    typedef的语法描述 在现实生活中,信息的概念可能是长度,数量和面积等.在C语言中,信息被抽象为int.float和 double等基本数据类型.从基本数据类型名称上,不能够看出其所代表的物理属性 ...

  8. UVa 1394 约瑟夫问题的变形

    https://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem& ...

  9. vim编辑器的基本操作

    1.安装vim编辑器 最小化安装的linux是没有vim编辑器的,需要手动安装 # yum -y install vim-enhanced # vim +2 123 直接到123的第2行 2.vim的 ...

  10. android中ImageView讲解

    1.看布局文 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns ...