AngularJS入门教程(一):静态模板


Posted in Javascript onDecember 06, 2014

为了说明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动态生成相同的列表。

Javascript 相关文章推荐
js 数组的for循环到底应该怎么写?
May 31 Javascript
学习javascript,实现插入排序实现代码
Jul 31 Javascript
jquery绑定原理 简单解析与实现代码分享
Sep 06 Javascript
js检测离开或刷新页面时表单数据是否更改的方法
Aug 02 Javascript
vue-resource 拦截器使用详解
Feb 21 Javascript
基于Vue的ajax公共方法(详解)
Jan 20 Javascript
JS将网址url转化为JSON格式的方法
Jul 02 Javascript
JS实现的简单分页功能示例
Aug 23 Javascript
微信小程序实用代码段(收藏版)
Dec 17 Javascript
vue自定义指令和动态路由实现权限控制
Aug 28 Javascript
jQuery实现朋友圈查看图片
Sep 11 jQuery
ant design vue中表格指定格式渲染方式
Oct 28 Javascript
AngularJS入门教程(零):引导程序
Dec 06 #Javascript
AngularJS入门教程之学习环境搭建
Dec 06 #Javascript
AngularJS入门教程之Hello World!
Dec 06 #Javascript
JavaScript中的Web worker多线程API研究
Dec 06 #Javascript
JavaScript实现的一个日期格式化函数分享
Dec 06 #Javascript
JavaScript实现twitter puddles算法实例
Dec 06 #Javascript
JavaScript实现的一个计算数字步数的算法分享
Dec 06 #Javascript
You might like
THINKPHP2.0到3.0有哪些改进之处
2015/01/04 PHP
Yii2 rbac权限控制操作步骤实例教程
2016/04/29 PHP
Yii2实现让关联字段支持搜索功能的方法
2016/08/10 PHP
PHP 二维关联数组根据其中一个字段排序(推荐)
2017/04/04 PHP
PHP基于rabbitmq操作类的生产者和消费者功能示例
2018/06/16 PHP
PHP时间相关常用函数用法示例
2020/06/03 PHP
JavaScript程序员应该知道的45个实用技巧
2014/03/04 Javascript
jquery text()方法取标签中的文本
2014/07/25 Javascript
使用JQuery实现Ctrl+Enter提交表单的方法
2015/10/22 Javascript
如何在Angular.JS中接收并下载PDF
2016/11/26 Javascript
JavaScript之排序函数_动力节点Java学院整理
2017/06/30 Javascript
vue实现长图垂直居上 vue实现短图垂直居中
2017/10/18 Javascript
node链接mongodb数据库的方法详解【阿里云服务器环境ubuntu】
2019/03/07 Javascript
Vue CLI3创建项目部署到Tomcat 使用ngrok映射到外网
2019/05/16 Javascript
JS异步处理的进化史深入讲解
2019/08/25 Javascript
[02:55]2018DOTA2国际邀请赛勇士令状不朽珍藏Ⅲ饰品一览
2018/08/01 DOTA
Python语言描述连续子数组的最大和
2018/01/04 Python
Python实现学校管理系统
2018/01/11 Python
Python中的单继承与多继承实例分析
2018/05/10 Python
spark: RDD与DataFrame之间的相互转换方法
2018/06/07 Python
Python使用cx_Freeze库生成msi格式安装文件的方法
2018/07/10 Python
python 读取dicom文件,生成info.txt和raw文件的方法
2019/01/24 Python
详解Python静态网页爬取获取高清壁纸
2019/04/23 Python
详解Django模版中加载静态文件配置方法
2019/07/21 Python
Django正则URL匹配实现流程解析
2020/11/13 Python
英国标志性奢侈品牌:Burberry
2016/07/28 全球购物
Doyoueven官网:澳大利亚健身服饰和配饰品牌
2019/03/24 全球购物
维多利亚的秘密阿联酋官网:Victoria’s Secret阿联酋
2019/12/07 全球购物
商务英语专业自荐信
2013/10/14 职场文书
中学校庆方案
2014/03/17 职场文书
工作经常出错的检讨书
2014/09/13 职场文书
优秀教育工作者事迹材料
2014/12/24 职场文书
小升初自荐信怎么写
2015/03/26 职场文书
退休教师追悼词
2015/06/23 职场文书
小学教师师德培训心得体会
2016/01/09 职场文书
银行求职信怎么写
2019/06/20 职场文书