AngularJS介绍

简介:

最近花了一点时间看了一下AngularJS,在此通过博文记录一下学习的过程,希望对大家有所帮助。
AngularJS 是一个 JavaScript 框架。它可通过

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>AngularJS</title>
        <script type="text/javascript" src="js/angular.min.js"></script>
    </head>

    <body ng-app="">
        <div>
            Hello {{'World'}}
        </div>
    </body>
</html>

这就是一个最简单使用AngularJS写的HelloWorld程序,有其他的JS库一样,我们需要引用相关的js文件才能使其正常工作,在这段代码中,我们使用了{{}}显示表达式的内容。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>AngularJS</title>
        <script type="text/javascript" src="js/angular.min.js"></script>
    </head>
    <body ng-app="" ng-init="msg='no msg'">
        <div>
            <input type="text" ng-model="msg"/>
        </div>
        <div>
            msg:{{msg}}
        </div>
        <div ng-bind="msg"></div>
    </body>
</html>

AngularJS 扩展了 HTML,AngularJS 通过 ng-directives 扩展了 HTML。
ng-app 指令定义一个 AngularJS 应用程序。
ng-app 指令初始化应用程序数据。
ng-model 指令把元素值(比如输入域的值)绑定到应用程序。
ng-bind 指令把应用程序数据绑定到 HTML 视图。

AngularJS 使得开发现代的单一页面应用程序(SPAs:Single Page Applications)变得更加容易。

  • AngularJS 把应用程序数据绑定到 HTML 元素。
  • AngularJS 可以克隆和重复 HTML 元素。
  • AngularJS 可以隐藏和显示 HTML 元素。
  • AngularJS 可以在 HTML 元素”背后”添加代码。
  • AngularJS 支持输入验证。
目录
相关文章
|
前端开发 JavaScript 测试技术
angularjs初识
angularjs初识
68 0
|
存储 缓存 前端开发
Day 2: AngularJS —— 对AngularJS的初步认识
我们发现了比较有趣的系列文章《30天学习30种新技术》,准备翻译,一天一篇更新,年终礼包。以下是第二天技术的译文。
161 0
Day 2: AngularJS —— 对AngularJS的初步认识
|
Web App开发 JavaScript 前端开发
AngularJS
AngularJS 是比较新的技术,版本 1.0 是在 2012 年发布的。 AngularJS 是由 Google 的员工 Miško Hevery 从 2009 年开始着手开发。 这是一个非常好的构想,该项目目前已由 Google 正式支持,有一个全职的开发团队继续开发和维护这个库。
1094 0
|
JavaScript 前端开发
|
JSON JavaScript 前端开发
|
JavaScript 前端开发 容器
|
安全 缓存 前端开发
|
JavaScript 前端开发 缓存
|
JavaScript 前端开发