首页 > 其他 > 详细

Angular(ng-include指令-嵌套)

时间:2017-05-30 18:37:27      阅读:528      评论:0      收藏:0      [点我收藏+]

html部分

.........................................................................................

<!DOCTYPE html>
<html lang="en" ng-app="myApp">
<head>
<meta charset="UTF-8">
<title>ng-include指令</title>
<style>
.large{
background-color: blue; color: white;
text-align: center;
font: bold 50px/80px verdana, serif;
border: 6px black ridge; }
.small{
background-color: lightgrey;
text-align: center;
border: 1px black solid; }
a{
color: blue; text-decoration: underline;
cursor: pointer; }
</style>

</head>
<body>
<div ng-controller="MyCtrl">
[<a ng-click="titleBar=‘large.html‘">使用大标题</a>]
[<a ng-click="titleBar=‘small.html‘">使用小标题</a>] <!--titleBar 标题栏-->
<div ng-include="titleBar"></div> <!--ng-include 指令用于包含外部的 HTML 文件-->
</div>
</body>
<script src="js/angular-1.3.0.js"></script>
<script src="js/t8.js"></script>
</html>

........................................................................................
js部分
var myApp=angular.module(‘myApp‘,[]);
myApp.controller(‘MyCtrl‘,function ($scope) {
$scope.titleBar="small.html"
$scope.titleBar="large.html"
});


Angular(ng-include指令-嵌套)

原文:http://www.cnblogs.com/YoogaChan/p/6920872.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!