angularJS介绍。

1 <p>Nothing here {{‘yet‘+‘!‘}}</p>

AngularJS的作用:把后台返回的JSON作为前端的model.在angularJS中使用html进行渲染。
或者后台的视图作为前端的模型,而整个前端就是后台的视图。

ng-app指令标记了angularJS脚本的作用域,在<html>中添加ng-app属性即说明整个<html>都是angularJS脚本作用域。
AnuglarJS脚本标签。
<script src="lib/angular/angular.js"></script>

这行代码载入angular.js脚本,当浏览器将整个HTML页面载入完毕后,将会执行该angular.js脚本。angular.js脚本运行后将会寻找含有NG-APP指令的HTML标签。该标签定义了angularJS应用的作用域。

双大括号绑定的表达式,绑定的表达式告诉angularlarJS需要运算其中的表达式,并将结果插入到DOM中。DOM可以随着表达式运算结果的改变而实时的更新。
angularJS表达式仅在angularJS中作用域中运行,而不是在整个DOM中运行。

<ul>
<li ng-repeat=‘phone in phones‘>
{{phone.name}}
<p>{{phone.snippet}}</p>
</li>
</ul>

在<li>标签里面,ng-repeat=‘phpne in phones‘ 语句是一个angularJS 迭代器。这个迭代器告诉angularJS用第一个<li>标签作为模板,为列表中每一部手机创建一个li元素。

时间: 2024-08-03 12:21:08

angularJS介绍。的相关文章

AngularJS 介绍

简介 AngularJS是为了解决静态网页技术在构建动态应用上的不足. AngularJS通过使用我们称为 标识符 (directives)的结构,让浏览器能够识别新的语法.例如: - 使用双大括号{{}}语法进行数据绑定: - 使用DOM控制结构来实现迭代或者隐藏DOM片段: - 支持表单和表单的验证: - 能将逻辑代码关联到相关的DOM元素上: - 能将HTML分组成可重用的组件. 1.  ng-app :指令标记了 AngularJS 脚本的作用域. <html lang="en&q

AngularJS介绍

### 什么是 AngularJS - 一款非常优秀的前端高级 JS 框架- 最早由 Misko Hevery 等人创建- 2009 年被 Google 公式收购,用于其多款产品- 目前有一个全职的开发团队继续开发和维护这个库- 有了这一类框架就可以轻松构建 SPA 应用程序- 轻松构建 SPA(单一页面应用程序)- 单一页面应用程序: + 只有一个页面(整个应用的一个载体) + 内容全部是由AJAX方式呈现出啦的- 其核心就是通过指令扩展了 HTML,通过表达式绑定数据到 HTML. ###

AngularJS入门基础系列—目录索引

AngularJS 特性 单页Web应用(SinglePage) 模板(template) Controller(控制器) Route(路由) Directive(指令) Filter(过滤器) AngularJS实现的一些小功能 演示AngularJS简单的双向绑定功能示例 菜单切换示例 TODOLIST的示例 冒泡排序算法视觉化 AngularJS介绍 我对AngularJS框架的理解

[后端人员耍前端系列]AngularJs篇:30分钟快速掌握AngularJs

一.前言 对于前端系列,自然少不了AngularJs的介绍了.在前面文章中,我们介绍了如何使用KnockoutJs来打造一个单页面程序,后面一篇文章将介绍如何使用AngularJs的开发一个单页面应用程序.在开始使用AngularJs开发SPA之前,我觉得有必要详细介绍下AngularJs所涉及的知识点.所有也就有了这篇文章. 二.AngularJs介绍 AngularJS是Google推出的一款Web应用开发框架.它提供了一系列兼容性良好并可扩展的服务,包括数据绑定.DOM操作.MVC和依赖注

AngularJs 用 $location 设置和判断在哪个页面

之前有个判断在那个页面上的问题困扰了我很久~后来查了很久的文档才找到的$location这个注入的Service,和大家分享下拉~省的你们找啦~ 当然可以用window.location来达到同样的目的. 我是不是棒棒哒?~ 前方高能......................................... 这是AngularJS 介绍$location的网址啦(想阅读先翻墙):https://docs.angularjs.org/guide/$location 言归正传........

Angular系列------AngularJS入门教程:导言和准备(转载)

学习AngularJS的一个好方法是逐步完成本教程,它将引导您构建一个完整的AngularJS web应用程序. 该web应用是一个Android设备清单的目录列表,您可以筛选列表以便查看您感兴趣的设备,然后查看设备的详细信息. 本教程将向您展示AngularJS怎样使得web应用更智能更灵活,而且不需要各种扩展程序或插件. 通过本教程的学习,您将: 阅读示例学习怎样使用AngularJS的客户端数据绑定和依赖注入功能来建立可立即响应用户操作的动态数据视图. 学习如何使用AngularJS创建数

AngularJS从构建项目开始

AngularJS从构建项目开始 AngularJS体验式编程系列文章,将介绍如何用angularjs构建一个强大的web前端系统.angularjs是由Google团队开发的一款非常优秀web前端框架.在当前如此多的web框架下,angularjs能脱颖而出,从架构设计上就高人一等,双向数据绑定,依赖注入,指令,MVC,模板.Angular.js创新地把后台技术融入前端开发,扫去jQuery一度的光芒.用angularjs就像写后台代码,更规范,更结构化,更可控. 关于作者 张丹(Conan)

30分钟快速掌握AngularJs

[后端人员耍前端系列]AngularJs篇:30分钟快速掌握AngularJs 一.前言 对于前端系列,自然少不了AngularJs的介绍了.在前面文章中,我们介绍了如何使用KnockoutJs来打造一个单页面程序,后面一篇文章将介绍如何使用AngularJs的开发一个单页面应用程序.在开始使用AngularJs开发SPA之前,我觉得有必要详细介绍下AngularJs所涉及的知识点.所有也就有了这篇文章. 二.AngularJs介绍 AngularJS是Google推出的一款Web应用开发框架.

带你走近AngularJS - 体验指令实例

带你走近AngularJS系列: 带你走近AngularJS - 基本功能介绍 带你走近AngularJS - 体验指令实例 带你走近AngularJS - 创建自定义指令 ------------------------------------------------------------------------------------------------ 之前我们已经介绍了所有的AngularJS 基础知识,下面让我们通过实例来加深记忆,体验自定义指令的乐趣. 手风琴指令 我们展示的第