1-8.Angular-ng-include

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>

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容