JS框架~Angularjs
无意中看到anytao的项目，工作台，使用了Angularjs框架，感觉在前端表现上用户体验比较好，于是就简单看了一下，原来使用很简单，或者说，人家把代码封装的很好，以至于开发人员调用时比较简单，呵呵，使用Angularjs必须将你的html标记进行标识一下，告诉人家，我要用Angularjs来渲染页面了，事实上，Angularjs带合我们最重要的不是页面表现上，而是数据绑定上，它使ＨＴＭＬ标记不那么死板，下面看一个ＤＥＭＯ就会明白了。
下面是一个页面元素绑定的例子
<html lang="en" ng-app>
<body>
<div ng-controller="Ctrl">
Enter name:
<input type="text" ng-model="name"><br>
Hello <span ng-bind="name"></span>!
</div>
</body>
</html>
//对应的ＪＳ代码如下：
function Ctrl($scope) {
$scope.name = 'Whirled';
}
如果不希望改变页面的html标记，也可以手动为Angularjs初始化，代码如下：
angular.element(document).ready(function () {
angular.bootstrap(document);
});
而且Angularjs支持对象模型，你可以很方便的使用面向对象的特性
看下面例子，是有一个对象user,user有name和last两个属性
<div ng-controller="Ctrl3">
User name:
<input type="text" name="userName" ng-model="user.name" required>
Last name:
<input type="text" name="lastName" ng-model="user.last">
<p>
你输入的内容为：
user.name:<span ng-bind="user.name"></span>
user.last:<span ng-bind="user.last"></span>
</p> </div>
//对应的ＪＳ代码如下：
function Ctrl3($scope) {
$scope.user = { name: 'zhang', last: 'zhanling' };
}
对于Angularjs的引用可以直接使用下面的地址：
URL:http://code.angularjs.org/1.2.3/angular.min.js
<script src="http://code.angularjs.org/1.2.3/angular.min.js"></script>
对于Angularjs的ＡＰＩ请查看
http://docs.angularjs.org/
JS框架~Angularjs的更多相关文章
- 媲美jQuery的JS框架——AngularJS（一）
前言 相信原生JS大家都不陌生,至于为什么说原生,是因为在JS的基础上衍生出了很多的框架.有些框架的使用非常广泛,甚至已经达到了媲美原生的地步.在之前的文章中给大家介绍了jQuery这一介绍框架.今天 ...
- 一款优秀的前端JS框架—AngularJS
前 言 AngularJS 是一个 JavaScript 框架.它可通过 <script> 标签添加到 HTML 页面. AngularJS 通过 指令 扩展了 HTML,且通过 表 ...
- 媲美jQuery的JS框架----AngularJS（二）
前言 对于AngularJS什么,小编在这就不多做介绍了.大家可以看小编的上一篇博客. 言归正传,小编在上一篇博客中介绍了AngularJS中的指令.表达式还有非常实用的三种服务.接下来,带大家看一看 ...
- 【js类库AngularJs】web前端的mvc框架angularjs之hello world
AngularJS诞生于2009年,由Misko Hevery 等人创建,后为Google所收购.是一款优秀的前端JS框架,已经被用于Google的多款产品当中.AngularJS有着诸多特性,最为核 ...
- 前端Js框架汇总
概述: 有些日子没有正襟危坐写博客了,互联网飞速发展的时代,技术更新迭代的速度也在加快.看着Java.Js.Swift在各领域心花路放,也是煞是羡慕.寻了寻.net的消息,也是振奋人心,.net co ...
- js框架简明
jquery 主要战场还是在dom这块.其它经典怀旧的2个需要了解一下,mootools, prototype.是他们启发了js向工程化,团队化,协作化发展的转变,yui虽然听说停止开发了,但他的代码 ...
- 《Node.js+MongoDB+AngularJS Web开发》读书笔记及联想
总体介绍 <Node.js+MongoDB+AngularJS Web开发>,于2015年6月出版,是一本翻译过来的书,原书名为<Node.js,MongoDB and Angula ...
- JS 框架之我感
对于一些js框架在我看来,都是将前端的表现动态化,即用动态js把html加载到页面上,如angularJS的MVVM开发模式(已接触),ReactJS的View层组件化(学习中),还有一些只听过没见过 ...
- 一个非常好用的框架-AngularJS(一)
前 言 AngularJS诞生于2009年,由Misko Hevery 等人创建,后为Google所收购.是一款优秀的前端JS框架,已经被用于Google的多款产品当中.An ...
随机推荐
- UESTC_秋实大哥打游戏 2015 UESTC Training for Data Structures<Problem H>
H - 秋实大哥打游戏 Time Limit: 3000/1000MS (Java/Others) Memory Limit: 65535/65535KB (Java/Others) Subm ...
- 《火球——UML大战需求分析》(第3章 分析业务模型-类图)——3.8 小结与练习
摘要:类图(Class Diagram)可能是用得最多的一种UML图.类图的基本语法并不复杂,你可能最多学习两三天就可以掌握,然而要真正做到活用类图则可能需要几年的功力.类图是锻炼面向对象分析(OOA ...
- PHP MySQL Update 之 Update
更新数据库中的数据 UPDATE 语句用于在数据库表中修改数据. 语法 UPDATE table_name SET column_name = new_value WHERE column_name ...
- $.cookie is not a function
在调试网站的时候,用jquery获取cookie时,报错: $.cookie is not a function; 一般情况$.cookie is not a function;错误原因: 一.没有引 ...
- java一个简单的管理系统
用java实现的简单管理系统 运行出来的状态 实现了新增.删除.借出.归还.排行榜简单的功能! 下面是简单的代码 首先定义一个书籍类,自己打开哦! public class Book implemen ...
- DICOM：C-GET与C-MOVE对照剖析
背景: 之前专栏中介绍最多的两款PACS各自是基于dcmtk的dcmqrscp以及Orthanc.和基于fo-dicom的DicomService(自己开发的).该类应用场景都是针对于局域网,因此在使 ...
- Unity 3D 连接Mysql数据库
要想使用Unity直接连接数据库需要以下几个动态库
- UILabel + 导入字体
UILabel * label = [[UILabel alloc]initWithFrame:CGRectMake(10, 100, 300, 100)]; 1.设置文字颜色 label.textC ...
- hdu2206IP的计算
Problem Description 在网络课程上,我学到了很多有关IP的知识.IP全称叫网际协议,有时我们又用IP来指代我们的IP网络地址,现在IPV4下用一个32位无符号整数来表示,一般用点分方 ...
- qt界面不显示的原因
用qt designer弄了一个qq.ui 新建一个空项目,把qq.ui加入,新建一个qq类,qq.h如下 #ifndef QQ#define QQ #include <QMainWindow& ...