• template:

    如果我们只需要在ng-view 中插入简单的HTML 内容，则使用该参数：

    .when('/computers',{template:'这是电脑分类页面'})

  • templateUrl:

    如果我们只需要在ng-view 中插入HTML 模板文件，则使用该参数：

    $routeProvider.when('/computers', {
    
    templateUrl: 'views/computers.html',
    
});

例 template指令

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.static.runoob.com/libs/angular.js/1.4.6/angular. min.js"></script>
</head>
<body ng-app="myApp">
<runoob-directive></runoob-directive><!-- E元素-->
<div class="runoob- directive"></div><!-- C样式-->
<div runoob-directive></div><!-- A属性-->
<!-- directive: runoob-directive --><!- - M注释-->
<script>
var app = angular.module("myApp", []);
app.directive("runoobDirective", function() {
return {
restrict : "ACEM",//A属性C样式E元素M注释
replace : true,
template : "<h1>自定义指令222!</h1>"=======页面中显示的是这里的内容，包括标签，如果这里的标签与内容越来越多，会难以维护。
};
});
</script>
</body>
</html>

====以上指令内容是被标签包围起来的，如果标签越来越多，维护不方便，书写也困难，解决以上问题，将template的内容写在一个页面上，这里的内容不再是内容，而是一个页面的地址。

也就相当于路由的页面跳转的这个功能了

angularJs之template指令的更多相关文章

  1. AngularJS中的指令全面解析（转载）

    说到AngularJS,我们首先想到的大概也就是双向数据绑定和指令系统了,这两者也是AngularJS中最为吸引人的地方.双向数据绑定呢,感觉没什么好说的,那么今天我们就来简单的讨论下AngularJ ...

  2. 带你走近AngularJS - 创建自定义指令

    带你走近AngularJS系列: 带你走近AngularJS - 基本功能介绍 带你走近AngularJS - 体验指令实例 带你走近AngularJS - 创建自定义指令 ------------- ...

  3. 你知道用AngularJs怎么定义指令吗？

    前言 最近学习了下angularjs指令的相关知识,也参考了前人的一些文章,在此总结下. 欢迎批评指出错误的地方.   Angularjs指令定义的API AngularJs的指令定义大致如下 ang ...

  4. Ⅵ.AngularJS的点点滴滴-- 指令

    指令 基本用法 <html> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.2/angul ...

  5. angularJS之使用指令封装DOM操作

    angularJS之使用指令封装DOM操作 创建指令 指令也是一种服务,只是这种服务的定义有几个特殊要求: 必须使用模块的directive()方法注册服务 必须以对象工厂/factory()方法定义 ...

  6. AngularJS创建新指令 - 基本功能

    指令(Directives)是所有AngularJS应用最重要的部分.尽管AngularJS已经提供了非常丰富的指令,但还是经常需要创建应用特定的指令. AngularJS原有的指令 ng-init  ...

  7. [转]你知道用AngularJs怎么定义指令吗？--很详细

    前言 最近学习了下angularjs指令的相关知识,也参考了前人的一些文章,在此总结下. 欢迎批评指出错误的地方.   Angularjs指令定义的API AngularJs的指令定义大致如下 ang ...

  8. AngularJS SPA Template For Visual Studio

    单页面应用程序(SPA)[使用JavaScript.CSS和HTML强大的功能,可以构建一个单页面应用程序(SPAs)],它提供了丰富的用户体验页面.导航技术和AJAX提供必要的功能,而不用重新加载页 ...

  9. 使用Angularjs的ng-cloak指令避免页面乱码

    在使用Anguarjs进行web开发或者进行SPA(single page application)开发时,往往会遇到下面这样的问题. 刷新页面时,页面会出现一些乱码,这里的乱码具体是指`{{expr ...

随机推荐

  1. Hangover[POJ1003]

    Hangover Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 121079   Accepted: 59223 Descr ...

  2. unity update 和fixedudpate

    但是Update会在每次渲 染新的一帧时被调用. 而FixedUpdate会在每个固定的时间间隔被调用,

  3. POJ3469 & 最小割(最大流)模板

    就是一个求最小割. sol: 数据比较大,n有20000,内部相连的边有20w,这么算算就要存八九十万的边,空间显然降不下来...然而打了dinic并不觉得快很多...最快跑到3800+ms 然后跪一 ...

  4. 如何将一个对象存到网页中并在js中使用

    需求:希望在js中使用Controller传过来的对象,特别是对象里存有list的数据. 不希望循环使用隐藏域. 解决办法:在View中使用Json.Net序列化: @{ string jsonStr ...

  5. App如何适应 iPhone 5s/6/6 Plus 三种屏幕的尺寸？

    来自//www.cocoachina.com/ 初代 iPhone 2007 年,初代 iPhone 发布,屏幕的宽高是 320 x 480 像素.下文也是按照宽度,高度的顺序排列.这个分辨率一直到 ...

  6. Linux常见练习题

    1./dev/hda5在Linux中表示什么? A. IDE0接口上从盘       B. IDE0接口上主盘的逻辑分区 C. IDE0接口上主盘的第五个分区    D.IDE0接口上从盘的扩展分区  ...

  7. JS代码判断字符串中有多少汉字【转】

    $("form").submit(function () { 2 var content = editor.getContentTxt(); 3 var sum = 0; 4 re ...

  8. C# Textbox的ImeMode取值对中文输入法的影响 （转）

    摘自:http://blog.csdn.net/jhycjhyc/article/details/6578570 C# Textbox的ImeMode取值对中文输入法的影响           取值 ...

  9. jQuery延迟加载(懒加载)插件 – jquery.lazyload.js

    引入:<script type="text/javascript" src="${base}/resources/shop/js/jquery.lazyload.j ...

  10. Maya 脚本控制物体自转

    在Maya中,我们可以用脚本来控制物体的自转方向,速度等等,步骤如下: 选择需要操作的物体object,打开通道盒Channel Box,点击编辑Edit,打开表达式Expressions面板 选择需 ...