ionic准备之angular基础——模板引入（7）

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body ng-app="myApp">
    <div ng-controller="firstController">

        这是本页面

        <!--第一种引入方式-->
        <div ng-include="url"></div>


        <!--第二种方式引入文件-->
        <div ng-include="tpl"></div>
        <script type="text/ng-template" id="myTpl">
            这是模板
        </script>
    </div>
</body>
<script src="angular/angular.js"></script>
<script type="text/javascript">
    var app=angular.module("myApp",[]);

    app.controller('firstController',function($scope){
        /*第一种方式，直接引入外部的模板文件，，，在上面的ng-app中的div引入ng-include*/
        $scope.url="demo04.html";

        /*在上面的ng-app内部定义script标签，定义id，type属性，并且在$scope挂载id，在div中ng-include=变量名*/
        $scope.tpl="myTpl";
    })


</script>
</html>

在网页的开发中，模板的引入是少不了的，angular中提供两种模板的引入方式，一种是外部文件的模板，另外一种是内部script标签的方式去引入。　　