Angular系列----AngularJS入门教程02:静态模板(转载)
为了说明angularJS如何增强了标准HTML,我们先将创建一个静态HTML页面模板,然后把这个静态HTML页面模板转换成能动态显示的AngularJS模板。
在本步骤中,我们往HTML页面中添加两个手机的基本信息,用以下命令将工作目录重置到步骤1。
git checkout -f step-1
请编辑app/index.html文件,将下面的代码添加到index.html文件中,然后运行该应用查看效果。
app/index.html
<ul>
<li>
<span>Nexus S</span>
<p>
Fast just got faster with Nexus S.
</p>
</li>
<li>
<span>Motorola XOOM™ with Wi-Fi</span>
<p>
The Next, Next Generation tablet.
</p>
</li>
</ul>
练习
尝试添加多个静态HTML代码到index.html, 例如:
<p>Total number of phones: 2</p>
总结
本步骤往应用中添加了静态HTML手机列表, 现在让我们转到步骤2以了解如何使用AngularJS动态生成相同的列表。
Angular系列----AngularJS入门教程02:静态模板(转载)的更多相关文章
- Angular系列---- AngularJS入门教程03:AngularJS 模板(转载)
是时候给这些网页来点动态特性了——用AngularJS!我们这里为后面要加入的控制器添加了一个测试. 一个应用的代码架构有很多种.对于AngularJS应用,我们鼓励使用模型-视图-控制器(MVC)模 ...
- Angular系列----AngularJS入门教程01:AngularJS模板 (转载)
是时候给这些网页来点动态特性了——用AngularJS!我们这里为后面要加入的控制器添加了一个测试. 一个应用的代码架构有很多种.对于AngularJS应用,我们鼓励使用模型-视图-控制器(MVC)模 ...
- Angular系列----AngularJS入门教程00:引导程序(转载)
我们现在开始准备编写AngularJS应用——phonecat.这一步骤(步骤0),您将会熟悉重要的源代码文件,学习启动包含AngularJS种子项目的开发环境,并在浏览器端运行应用. 进入angul ...
- Angular系列----AngularJS入门教程04:迭代器过滤(转载)
我们在上一步做了很多基础性的训练,所以现在我们可以来做一些简单的事情喽.我们要加入全文检索功能(没错,这个真的非常简单!).同时,我们也会写一个端到端测试,因为一个好的端到端测试可以帮上很大忙.它监视 ...
- Angular系列------AngularJS入门教程:导言和准备(转载)
学习AngularJS的一个好方法是逐步完成本教程,它将引导您构建一个完整的AngularJS web应用程序. 该web应用是一个Android设备清单的目录列表,您可以筛选列表以便查看您感兴趣的设 ...
- Angular系列----AngularJS入门教程05:双向绑定(转载)
在这一步你会增加一个让用户控制手机列表显示顺序的特性.动态排序可以这样实现,添加一个新的模型属性,把它和迭代器集成起来,然后让数据绑定完成剩下的事情. 请重置工作目录: git checkout -f ...
- [转载]AngularJS入门教程02:AngularJS模板
是时候给这些网页来点动态特性了——用AngularJS!我们这里为后面要加入的控制器添加了一个测试. 一个应用的代码架构有很多种.对于AngularJS应用,我们鼓励使用模型-视图-控制器(MVC)模 ...
- 【转载】图灵AngularJS入门教程
摘自图灵的AngularJS入门教程:http://www.ituring.com.cn/article/13471 感觉非常不错,所以推荐到首页一下! (一)Hello World! 开始学习Ang ...
- AngularJS入门教程:日期格式化
AngularJS入门教程:日期格式化[转载] 本地化日期格式化: ({{ today | date:'medium' }})Nov 24, 2015 2:19:24 PM ({{ today | d ...
随机推荐
- vs2013 下载
http://download.microsoft.com/download/2/4/9/249BF223-5B84-4259-9424-429E66F45509/VS2013_RC_ULT_CHS. ...
- eclipse、myeclipse,svn插件subclipse 忘记密码的解决方法(win7、win8、xp)
如果是Windows7.Windows8系统只要删除当前用户目录下的AppData\Roaming\Subversion\auth\svn.simple 比如我的用户名taoweiji,就删除C:\U ...
- Enclosure POJ
0:Enclosure http://poj.openjudge.cn/challenge3/0/ 查看 提交 统计 提问 总时间限制: 1000ms 内存限制: 131072kB 描述 为了防止 ...
- WPF下载远程文件,并显示进度条和百分比
WPF下载远程文件,并显示进度条和百分比 1.xaml <ProgressBar HorizontalAlignment="Left" Height="10&quo ...
- java生成解析xml的另外两种方法Xstream
Xstream生成和解析xm和JAXB生成和解析xml的方法. 一,Xstream Xstream非jdk自带的,需要到入Xstream-1.4.3.jar和xpp3_min-1.1.4.jar 1. ...
- Microsoft Office Excel 不能访问文件 的解决办法
Microsoft Office Excel 不能访问文件"a.xls". 可能的原因有: ? 文件名称或路径不存在. ? 文件正被其他程序使用. ? 您正要保存的工作簿与当前 ...
- jade模板引擎学习笔记(WebsStorm9.0.3+ nodejs+express+jade)
jade环境搭建 jade标签写法 jade注释 jade添加类名.id.属性 jade添加脚本,css jade变量 jade多行文本显示 jade流程代码:for,each,while jade流 ...
- android EditText inputType说明
在开发的过程中,通常会用到EditText,如何让虚拟键盘来适应输入框中内容的类型,通常我们都会在xml文件中加入android:inputType="". android:inp ...
- python-redis 入门
redis官网http://redis.io Redis是一个开源的使用ANSI C语言编写.支持网络.可基于内存亦可持久化的日志型.Key-Value数据库,并提供多种语言的API. Redis是一 ...
- MySQL数据库之数据类型BOOL/BOOLEAN与TINYINT测试总结
From: http://database.51cto.com/art/201203/323863.htm 网络上很多人咨询mysql是否提供布尔类型?MySQL数据库确实提供布尔类型,此数据类型的关 ...