Angular-ng-include
1.ng-style
2.ng-include
- 在開發過程中,有時候需要把一個模塊單獨寫到一個頁面中,以便復用.
使用原生html沒有辦法達到這種要求,一般都是通過服務器來完成此功能.我們可以使用angular當中的指令 ng-include來完成.
ng-include 它的本質是發送一個ajax請求, 把請求結果, 放入對應標簽里邊.
<body ng-app="app" ng-controller="xmgController">
<!--1.ng-style它的值,是模型當中的值-->
<!--<p ng-style="sty">我是style</p>-->
<!--
2.ng-include
在html當中是沒有辦法直接引入其它文件。
瀏覽器不允許html對文件進行操作。
原因:出于安全考慮。
原理:
其實是發送了一個ajax請求。
把請求的結果,插入到dom當中。
-->
<div ng-include="'08-head.html'"></div>
<div>主題</div>
<div ng-include="'08-foot.html'"></div>
</body>
<script src="js/angular.js"></script>
<script>
//1.創建模塊
var app = angular.module('app', []);
//2.創建控制器
app.controller('xmgController', ['$scope', function ($scope) {
$scope.sty = {
"font-size" : "100px",
"color" : "blue"
};
}]);
//3.綁定模塊 ng-app="app"
//4.綁定控制器 ng-controller="xmgController"
</script>