<!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标签的方式去引入。　　

ionic准备之angular基础——模板引入（7）的更多相关文章

  1. ionic准备之angular基础———服务provider 和 factory和service（9）

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. ionic准备之angular基础——格式化数据以及过滤器（8）

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. ionic准备之angular基础——dom操作相关（6）

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. ionic准备之angular基础——$watch,$apply,$timeout方法（5）

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. ionic准备之angular基础——run方法（4）

    可以看到整个angular.module对象具有以下各种属性和方法 <!DOCTYPE html> <html lang="en"> <head> ...

  6. ionic准备之angular基础——继承（3）

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. Angular基础---->AngularJS的使用(一)

    AngularJS主要用于构建单页面的Web应用.它通过增加开发人员和常见Web应用开发任务之间的抽象级别,使构建交互式的现代Web应用变得更加简单.今天,我们就开始Angular环境的搭建和第一个实 ...

  8. Bootstrap 4/3 页面基础模板 与 兼容旧版本浏览器

    Bootstrap 3 与 4 差别很大,目录文件结构.所引入的内容也不同,这里说说一下 Bootstrap 引入的文件.网页模板和兼容性问题.本网站刚刚搭建好,正好发一下文章原来测试网站. Boot ...

  9. angular 缓存模板 ng-template $templateCache

    由于浏览器加载html模板是异步加载的,如果加载大量的模板会拖慢网站的速度,这里有一个技巧,就是先缓存模板. 使用angular缓存模板主要有三种方法: 方法一:通过script标签引入 <sc ...

随机推荐

  1. SD卡给MCU升级

    目 录1. 前言2. 初识BootLoader2.1 百度百科的BootLoader2.2 BootLoader的简单理解2.3 BootLoader的作用3. BootLoader预备知识3.1 复 ...

  2. Windows Server 2008允许多用户登录远程桌面

    远程桌面是windows管理员对服务器进行管理最常用的方式,默认情况下windows server服务器是只允许单个远程链接的,如何开启多个用户远程桌面,下面就来介绍.   工具/原料   windo ...

  3. Python-Python及PyCharm的下载与安装

    一.简介 Python:英 -[‘paɪθ ə n]或[‘paɪθɑn] 89年诞生 可用于软件开发: 游戏后台.搜索.图形界面 网站 C\S(Client/Server)软件 科学计算 亦可以进行系 ...

  4. WeiXin 验证成为开发者和更换服务器验证代码

    using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Da ...

  5. centos7 挂载exfat格式的u盘

    下载 两个包 rpm -ivh http://download1.rpmfusion.org/free/el/updates/7/x86_64/f/fuse-exfat-1.2.8-1.el7.x86 ...

  6. 使用Sublime Text 3 编写python

    1,下载Sublime Text 3 链接:http://pan.baidu.com/s/1eROBpB0 密码:cqjr 2,安装 注意安装时去掉捆绑的软件安装选项,有两处. 3,安装完成打开软件, ...

  7. Bfs【p2385】 青铜莲花池

    题目描述--->p2385 青铜莲花池 分析 很明显了,题目告诉我们有八个方向,当然优先考虑bfs! 很简单的bfs,重点在于考虑清楚8个方向. 自己刚开始打错了 emmm 给大家上一个图.↓ ...

  8. [Lydsy1710月赛] 小B的数字

    神TM 又又又又是构造题..... 很简单的化简就是,把2^k[i]都换成k[i] ,然后就可以得出 对于任意的i,k[i] * a[i] >= ∑k[]. 最优的构造肯定是使  k[i] = ...

  9. jsp笔记3(内置对象)

    jsp脚本中的9个内置对象: 1.application:javax.servlet.ServletContext的实例对象,该实例对象代表jsp所属的web应用本身,可用于在jsp页面或Servle ...

  10. [给自己扫盲]Node.js 究竟是什么？

    Node.js 究竟是什么? 一个 “编码就绪” 服务器 Node 是一个服务器端 JavaScript 解释器,它将改变服务器应该如何工作的概念.它的目标是帮助程序员构建高度可伸缩的应用程序,编写能 ...