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标签的方式去引入。
ionic准备之angular基础——模板引入(7)的更多相关文章
- ionic准备之angular基础———服务provider 和 factory和service(9)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ionic准备之angular基础——格式化数据以及过滤器(8)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ionic准备之angular基础——dom操作相关(6)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ionic准备之angular基础——$watch,$apply,$timeout方法(5)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ionic准备之angular基础——run方法(4)
可以看到整个angular.module对象具有以下各种属性和方法 <!DOCTYPE html> <html lang="en"> <head> ...
- ionic准备之angular基础——继承(3)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Angular基础---->AngularJS的使用(一)
AngularJS主要用于构建单页面的Web应用.它通过增加开发人员和常见Web应用开发任务之间的抽象级别,使构建交互式的现代Web应用变得更加简单.今天,我们就开始Angular环境的搭建和第一个实 ...
- Bootstrap 4/3 页面基础模板 与 兼容旧版本浏览器
Bootstrap 3 与 4 差别很大,目录文件结构.所引入的内容也不同,这里说说一下 Bootstrap 引入的文件.网页模板和兼容性问题.本网站刚刚搭建好,正好发一下文章原来测试网站. Boot ...
- angular 缓存模板 ng-template $templateCache
由于浏览器加载html模板是异步加载的,如果加载大量的模板会拖慢网站的速度,这里有一个技巧,就是先缓存模板. 使用angular缓存模板主要有三种方法: 方法一:通过script标签引入 <sc ...
随机推荐
- OpenCV 2.4.9 学习笔记(2)—— OpenCV内存自动管理
OpenCV自动内存管理 目前版本的OpenCV是自动处理所有自己的内存的,虽然这么说也不是很严谨.OpenCV在2.0版本中引入了一个新的C++接口,利用自动内存管理给出了解决问题的新方法.使用这个 ...
- BeeFramework 笔记 四(UISignal 总结)
http://yang152412.blog.163.com/blog/static/175861582201332321351862/ 一.UISignal的工作模式 1.发送Signal,比如从V ...
- 【原创】Linux环境下的图形系统和AMD R600显卡编程(6)——AMD显卡GPU命令格式
前面一篇blog里面描述了命令环缓冲区机制,在命令环机制下,驱动写入PM4(不知道为何会取这样一个名字)包格式的命令对显卡进行配置.这一篇blog将详细介绍命令包的格式. 当前定义了4中命令包,分别是 ...
- 配置Nginx来支持php
安装php7 下载地址:https://secure.php.net/downloads.php这里下载的是:wget http://ar2.php.net/distributions/php ...
- springBoot【01】
/* 使用spring官网的 http://start.spring.io/ 来建立项目包 生成入口文件,入口文件中对类注释@SpringBootApplication,这个注释是唯一的,标明这个类是 ...
- hdu 1811(缩点+拓扑排序+并查集)
Rank of Tetris Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)To ...
- Ubuntu14.04安装配置LAMP环境(php5.6)
sudo apt-get install python-software-properties sudo apt-get update sudo apt-get install vim sudo ap ...
- 51nod 1004 n^n的末位数字【快速幂】
1004 n^n的末位数字 题目来源: Author Ignatius.L (Hdu 1061) 基准时间限制:1 秒 空间限制:131072 KB 分值: 5 难度:1级算法题 收藏 关注 给出 ...
- 详解xml
xml xml简介 XML是一种可扩展标记语言 (Extensible Markup Language, XML).是一种可扩展的标记语言,XML重在数据交换,用于不同平台或者应用程序之间交换数据,存 ...
- HashSet底层存储元素的源码分析
此类实现 Set 接口,由哈希表(实际上是一个 HashMap 实例)支持.它不保证 set 的迭代顺序:特别是它不保证该顺序恒久不变.此类允许使用 null 元素. HashSet<Strin ...