<!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. C++中的 Round(),floor(),ceil()

     2.1             2.6               -2.1               -2.6floor : 不大于自变量的最大整数             2          ...

  2. 信息传递(NOIP2015)(寻找最小环。。)

    原题传送门 这是一道寻找最小环的题目. 在做的时候给每一个点染色.. 防止再做已经搜过的点(优化) v[]表示是否访问的过,以及第一次访问该点的时间. u[]表示染色.. 这道题还可以用拓补排序做. ...

  3. cookie登录

    #coding:utf-8 import tornado.httpserver import tornado.ioloop import tornado.options import tornado. ...

  4. c++ 堆、栈、自由存储区、全局/静态存储区和常量存储区

    在C++中,内存分成5个区,他们分别是堆.栈.自由存储区.全局/静态存储区和常量存储区. 栈,就是那些由编译器在需要的时候分配,在不需要的时候自动清楚的变量的存储区.里面的变量通常是局部变量.函数参数 ...

  5. .net 实用功能

    c#的DateTime.Now函数详解 [C#]Color颜色对照表 Sql日期时间格式转换 关于asp.net中页面事件加载的先后顺序 asp.net在ie7中使用FileUpload上传前预览图片 ...

  6. 同步mysql数据到ElasticSearch的最佳实践

    Elasticsearch是一个实时的分布式搜索和分析引擎.它可以帮助你用前所未有的速度去处理大规模数据.ElasticSearch是一个基于Lucene的搜索服务器.它提供了一个分布式多用户能力的全 ...

  7. Web Api 返回图片流给前端

    public class TestController : ApiController { public HttpResponseMessage GetImg() { //获取文件的绝对路径 stri ...

  8. [CTSC2016]时空旅行(线段树+凸包)

    应该是比较套路的,但是要A掉仍然不容易. 下面理一下思路,思路清楚了也就不难写出来了. 0.显然y,z坐标是搞笑的,忽略即可. 1.如果x不变,那么直接set即可解决. 2.考虑一个空间和询问x0,通 ...

  9. linux下安装php报错configure: error: Cannot find MySQL header files under /usr/include/mysql.

    linux下安装php报错configure: error: Cannot find MySQL header files under /usr/include/mysql. 2013-03-04 1 ...

  10. Springboot默认加载application.yml原理以及扩展

    Springboot默认加载application.yml原理以及扩展 SpringApplication.run(...)默认会加载classpath下的application.yml或applic ...