<!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. ibatis批量操作补充

    ibatis批量操作  这文章的补充吧. review代码的时候发现一个页面应用排序设置功能,原先代码中,进行了循环update实现.虽然应用较少,不过无谓浪费数据库链接实在不是一个好的想法. 所以, ...

  2. 国内较快的maven镜像

    原文网址:http://www.cnblogs.com/dingyingsi/p/3856456.html 国内连接maven官方的仓库更新依赖库,网速一般很慢,收集一些国内快速的maven仓库镜像以 ...

  3. bootstrap-11

    下拉菜单(基本用法) 在使用Bootstrap框架的下拉菜单时,必须调用Bootstrap框架提供的bootstrap.js文件.当然,如果你使用的是未编译版本,在js文件夹下你能找到一个名为“dro ...

  4. mm/kmalloc.c

    /* *  linux/mm/kmalloc.c * *  Copyright (C) 1991, 1992  Linus Torvalds & Roger Wolff. * *  Writt ...

  5. LVS的调度算法

    LVS的调度算法(Scheduling Method)一共有10种 一.静态方法:仅根据算法本身进行调度 1.rr(Round Robin):轮询 2.wrr(Werghted Round Robin ...

  6. 排序算法总结（三）选择排序【Select Sort】

    一.原理 选择排序的原理非常简单,就是选出最小(大)的数放在第一位,在剩下的数中,选出最小(大)的数,放在第二位......重复上述步骤,直到最后一个数. 二.过程 原始数据 第一次排序,选出最小的数 ...

  7. mysql的source命令

    第一次使用 source导入 sql 文件时,死活提示不成功,偶然发现在输入文件所在路径是,必须用 "/"斜杠,而不能是反斜框 "\".

  8. Mvc4系列文章

    http://www.cnblogs.com/duanshuiliu/tag/MVC/

  9. (C#) 求两个数组的交集

    基本上在面试的时候,会具体到两个int数组,或string数组.具体也就是讨论算法. 首先需要的是和面试的人确认题目的含义,并非直接答题. 然后,可以提出自己的想法,首先最快的是用linq { Lis ...

  10. SQL Server 2008 数据库镜像部署实例之二 配置镜像，实施手动故障转移

    SQL Server 2008 数据库镜像部署实例之二 配置镜像,实施手动故障转移 上一篇文章已经为配置镜像数据库做好了准备,接下来就要进入真正的配置阶段 一.在镜像数据库服务器上设置安全性并启动数据 ...