AngularJS入门教程之静态模板详解


Posted in Javascript onAugust 18, 2016

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

以上就是AngularJS的静态模版的资料整理,后续继续补充相关资料,谢谢大家对本站的支持!

Javascript 相关文章推荐
跨浏览器的设置innerHTML方法
Sep 18 Javascript
JS 继承实例分析
Nov 04 Javascript
JS input文本框禁用右键和复制粘贴功能的代码
Apr 15 Javascript
jQuery EasyUI API 中文文档 - EasyLoader 加载器
Sep 29 Javascript
jQuery.each()用法分享
Jul 31 Javascript
使用js实现关闭js弹出层的窗口
Feb 10 Javascript
jquery实现pager控件示例
Apr 09 Javascript
Bootstrap每天必学之标签页(Tab)插件
Aug 09 Javascript
基于Vue的文字跑马灯组件(npm 组件包)
May 24 Javascript
详解webpack的配置文件entry与output
Aug 21 Javascript
webpack-dev-server远程访问配置方法
Feb 22 Javascript
详解小程序开发经验:多页面数据同步
May 18 Javascript
AngularJS入门教程引导程序
Aug 18 #Javascript
Bootstrap模态框(modal)垂直居中的实例代码
Aug 18 #Javascript
js 获取站点应用名的简单实例
Aug 18 #Javascript
BootStrap日期控件在模态框中选择时间下拉菜单无效的原因及解决办法(火狐下不能点击)
Aug 18 #Javascript
js修改onclick动作的四种方法(推荐)
Aug 18 #Javascript
AngularJS 整理一些优化的小技巧
Aug 18 #Javascript
BootStrap下拉框在firefox浏览器界面不友好的解决方案
Aug 18 #Javascript
You might like
自定义PHP分页函数
2006/10/09 PHP
php获取mysql版本的几种方法小结
2008/03/25 PHP
PHP网页游戏学习之Xnova(ogame)源码解读(四)
2014/06/23 PHP
适用于初学者的简易PHP文件上传类
2015/10/29 PHP
jquery+thinkphp实现跨域抓取数据的方法
2016/10/15 PHP
php使用函数pathinfo()、parse_url()和basename()解析URL
2016/11/25 PHP
JScript内置对象Array中元素的删除方法
2007/03/08 Javascript
javascript下判断一个元素是否存在的代码
2010/03/05 Javascript
让你的CSS像Jquery一样做筛选的实现方法
2011/07/10 Javascript
深入理解JavaScript作用域和作用域链
2011/10/21 Javascript
javascript 数组排序函数sort和reverse使用介绍
2013/11/21 Javascript
探讨JQUERY JSON的反序列化类 using问题的解决方法
2013/12/19 Javascript
点击按钮自动加关注的代码(sina微博/QQ空间/人人网/腾讯微博)
2014/01/02 Javascript
Window.Open如何在同一个标签页打开
2014/06/20 Javascript
javacript使用break内层跳出外层循环分析
2015/01/12 Javascript
JS实现仿微博可关闭弹出层效果
2015/09/21 Javascript
JavaScript图像延迟加载库Echo.js
2016/04/05 Javascript
使用jquery提交form表单并自定义action的方法
2016/05/25 Javascript
原生JS实现简单放大镜效果
2017/02/08 Javascript
webpack使用 babel-loader 转换 ES6代码示例
2017/08/21 Javascript
javascript+jQuery实现360开机时间显示效果
2017/11/03 jQuery
javascript 模块依赖管理的本质深入详解
2020/04/30 Javascript
vue print.js打印支持Echarts图表操作
2020/11/13 Javascript
js实现筛选功能
2020/11/24 Javascript
Python基于lxml模块解析html获取页面内所有叶子节点xpath路径功能示例
2018/05/16 Python
python实现旋转和水平翻转的方法
2018/10/25 Python
基于OpenCV python3实现证件照换背景的方法
2019/03/22 Python
python获取响应某个字段值的3种实现方法
2020/04/30 Python
基于python图书馆管理系统设计实例详解
2020/08/05 Python
资料员岗位职责
2013/11/17 职场文书
网站开发实习生的自我评价
2013/12/11 职场文书
总经理秘书工作职责
2013/12/26 职场文书
化妆品店促销方案
2014/02/24 职场文书
央视元宵晚会主持串词
2014/03/25 职场文书
军训通讯稿范文
2015/07/18 职场文书
Java实现多线程聊天室
2021/06/26 Java/Android