码迷,mamicode.com
首页 > 其他好文 > 详细

Angular(ng-include指令-嵌套)

时间:2017-05-30 19:40:08      阅读:179      评论:0      收藏:0      [点我收藏+]

标签:text   char   font   har   cursor   script   head   tle   pointer   

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指令-嵌套)

标签:text   char   font   har   cursor   script   head   tle   pointer   

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

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!