<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>

    <title></title>

</head>

<body>

    <div ng-app="">

        <p>姓名：<input type="text" ng-model="name"></p>

        <h1>hello {{name}}</h1>

    </div>

</body>

</html>

AngularJS 表达式

AngularJS 表达式写在双大括号内：{{ expression }}。

AngularJS 表达式把数据绑定到 HTML，这与 ng-bind 指令有异曲同工之妙。

AngularJS 将在表达式书写的位置"输出"数据。

AngularJS 表达式 很像 JavaScript 表达式：它们可以包含文字、运算符和变量。 

<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>

    <title>AngularJS 表达式</title>

</head>

<body>

    <div ng-app="">

        <p>我的第一个表达式：{{5+5}}</p>

    </div>

</body>

</html>
AngularJs应用

AngularJS 模块（Module） 定义了 AngularJS 应用。

AngularJS 控制器（Controller） 用于控制 AngularJS 应用。

ng-app指令定义了应用, ng-controller 定义了控制器。 

<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>

    <title>AngularJS 应用</title>

</head>

<body>

    <div ng-app="myApp" ng-controller="myCtrl">

        名:<input type="text" ng-model="firstname"><br>

        姓:<input type="text" ng-model="lastname"><br>

    </div>

<script>

    var app=angular.module("myApp",[]);

    app.controller("myCtrl",function($scope){

        $scope.firstname="John";

        $scope.lastname="Doe";

    });

</script>

</body>

</html>

angularJS学习之旅（1）的更多相关文章

  1. 我的AngularJS 学习之旅

    我的AngularJS 学习之旅 基础篇 1.Angular的 起源 2.比较Web 页面实现的几种方式 3.一些基本术语 4.Angular与其他框架的兼容性 5.总结 6.综合实例   很早之前就 ...

  2. AngularJS学习之旅—AngularJS 模块(十五)

    一.AngularJS 模块 模块定义了一个应用程序. 模块是应用程序中不同部分的容器. 模块是应用控制器的容器. 控制器通常属于一个模块. 1.创建模块 通过 AngularJS 的 angular ...

  3. AngularJS学习之旅

    开篇 最近由于项目上可能需要用到AngularJS,公司将技术学习.调研的任务安排了下来,因此开始了我的AngularJS学习之路. 在这之前没写过技术博客,主要是由于太懒,另外自愧文笔不好,因此一直 ...

  4. 我的AngularJS 学习之旅(二)

    记得某位大神说过,"时间就像海绵里的水,挤挤总是有的.".大多时候,与其说我是很忙而没时间去做自己想做的事, 倒不如说是懒得去做罢了. 废话不多说,接前一篇继续吧 3.3 指令(D ...

  5. AngularJS学习之旅—AngularJS 表单(十六)

    一.AngularJS 表单 AngularJS 表单是输入控件的集合. HTML 控件 以下 HTML input 元素被称为 HTML 控件: input 元素 select 元素 button ...

  6. AngularJS学习之旅—AngularJS 事件(十四)

    1.AngularJS 事件 ng-click ( 适用标签 :所有,触发事件:单击): ng-dblclick( 适用标签 :所有,触发事件:双击): ng-blur(适用标签 : a,input, ...

  7. AngularJS学习之旅—AngularJS HTML DOM(十三)

    1.AngularJS HTML DOM AngularJS 为 HTML DOM 元素的属性提供了绑定应用数据的指令. ng-disabled 指令:ng-disabled 指令直接绑定应用程序数据 ...

  8. AngularJS学习之旅—AngularJS Table(十一)

    1.AngularJS 表格 1. ng-repeat 指令可以完美的显示表格 AngularJS 实例 <!DOCTYPE html> <html> <head> ...

  9. AngularJS学习之旅—AngularJS Select(十)

    1.AngularJS Select(选择框) AngularJS 可以使用数组或对象创建一个下拉列表选项. ng-option:创建一个下拉列表,列表项通过对象和数组循环输出 eg: <div ...

随机推荐

  1. Pylot压力测试（linux）

    Pylot需要python2.5以上的版本,打开以后选择对应你的系统的版本,下载好之后双击安装. centOS5.5 系统版本python版本是2.4.3,所以要下载个2.5以上的. 1.下载Pyth ...

  2. 防止特殊html字符的问题（xxs攻击）方法

    快速对字符转义,避免跨站攻击XSS   XSS已经成为非常流行的网站攻击方式,为了安全起见,尽量避免用户的输入.可是有些情况下不仅不避免,反而要求鼓励输入,比如写博客.博客园开放性很高,可以运行手写的 ...

  3. rabin 素性检验 随机化算法

    #include <cstdio> #include <cstdlib> #include <ctime> typedef long long int LL; in ...

  4. hiho一下120周 后缀数组一·重复旋律

    后缀数组一·重复旋律 时间限制:5000ms 单点时限:1000ms 内存限制:256MB 描述 小Hi平时的一大兴趣爱好就是演奏钢琴.我们知道一个音乐旋律被表示为长度为 N 的数构成的数列. 小Hi ...

  5. pt-ioprofile分析查看mysql的真实IO情况

    针对IO密集型应用做系统调优的时候,我们通常都需要知道系统cpu  内存  io 网络等系统性能 和 使用率,结合应用本身的访问量,以及 mysql的性能指标来综合分析.比如说:我们将系统压力情况分为 ...

  6. JSBinding / Memory Management (GC)

    C# and JavaScript both have Garbage Collection (GC). They should not conflict with each other. Class ...

  7. SQL server数据缓存依赖

    SQL server数据缓存依赖有两种实现模式,轮询模式,通知模式. 1  轮询模式实现步骤 此模式需要SQL SERVER 7.0/2000/2005版本以上版本都支持        主要包含以下几 ...

  8. LuManager 2.0.97 设置shopex 手机版waptouch，绑定二级目录

    1.步骤,先要把主站的 限制目录访问那个勾选,去掉 2.创建新网站,不需要ftp,直接设置网站目录“/home/主站目录/waptouch” 3.保存

  9. IOS开发-属性动画和关键帧动画的使用

    CAMediaTiming是一个协议(protocol),CAAnimation是所有动画类的父类,但是它不能直接使用,应该使用它的子类. 继承关系: CoreAnmiation 核心动画 简写CA ...

  10. SilverlightOA源代码（可用于企业级Silverlight项目的二次开发，长年有效）

    Silverlight OA系统简介 系统功能简介 l 程序界面介绍: 左侧为主菜单,主菜单可以展开和收起,主菜单下面的所有模块都可以在数据库中扩展增加,模块的权限和用户角色挂钩,可以在数据库中创建多 ...