<!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. select、poll、poll的比较(转)

    原文地址:http://www.cnblogs.com/xuxm2007/archive/2011/08/15/2139809.html select.poll.epoll的比较 linux提供了se ...

  2. Linux版网易云音乐播放音乐时无限显示“网络错误”的解决办法

    安装 gstreamer0.10-plugins-good debian类系统: -plugins-good

  3. Bundle

    [[NSBundle mainBundle] pathForResource:@"someFileName" ofType:@"yourFileExtension&quo ...

  4. codeforces298c

    link:http://codeforces.com/problemset/problem/298/C 这道题目可以看出来我智商确实拙计 #include <iostream> #incl ...

  5. ups机制下停电提前关闭oracle数据库

    思路:在一个受ups保护的机器A1上写脚本,几分钟(如半分钟)ping不在ups保护的机器B,如果几次(如5次)ping不同,这时我们认为将要停电,此时脚本执行正常关闭受ups保护的机器上数据库的命令 ...

  6. C++实现不能被继承的类——终结类 分类： C/C++ 2015-04-06 14:48 64人阅读 评论(0) 收藏

    1.       问题 C++如何实现不能被继承的类,即终结类.Java中有final关键字修饰,C#中有sealed关键字修饰,而C++目前还没有类似的关键字来修饰类实现终结类,需编程人员手动实现. ...

  7. ajax中返回json数据有"

    1.将“转义为\" string table=sb.ToString(); table.Replace("\"","\\\"");

  8. python string

    string比较连接 >>> s1="python string" >>> len(s) 13 >>> s2=" p ...

  9. 基于SVG的web页面图形绘制API介绍

    转自:http://blog.csdn.net/jia20003/article/details/9185449 一:什么是SVG SVG是1999由W3C发布的2D图形描述语言,纯基于XML格式的标 ...

  10. 如何创建 CSS

    如何插入样式表 当读到一个样式表时,浏览器会根据它来格式化 HTML 文档.插入样式表的方法有三种: 外部样式表 当样式需要应用于很多页面时,外部样式表将是理想的选择.在使用外部样式表的情况下,你可以 ...