angularJs之template指令

最新推荐文章于 2023-10-12 18:28:00 发布

didong1899

最新推荐文章于 2023-10-12 18:28:00 发布

阅读量254

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/songyunxinQQ529616136/p/6214140.html

版权

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>
<div class="runoob- directive"></div>
<div runoob-directive></div>
<!- - 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的内容写在一个页面上，这里的内容不再是内容，而是一个页面的地址。

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

转载于:https://www.cnblogs.com/songyunxinQQ529616136/p/6214140.html

didong1899

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
angularJs之template指令

template:如果我们只需要在ng-view 中插入简单的HTML 内容，则使用该参数：.when('/computers',{template:'这是电脑分类页面'})templateUrl:如果我们只需要在ng-view 中插入HTML 模板文件，则使用该参数：$routeProvider.when('/computers', { t...
复制链接

扫一扫