<!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. mysql -workbench : Error cause by ' sql-mode = only-full-group-by'

    当mysql出现"only-full-group-by"问题时,是mysql的sql_mode设置出现了问题. 解决: 1.  找到mysql的 my.cnf文件,我的文件路径是: ...

  2. python是一个解释器

    python是一个解释器 利用pip安装python插件的时候,观察到python的运作方式是逐步解释执行的 适合作为高级调度语言: 异常的处理以及效率应该是主要的问题

  3. appserv升级php

    安装thinkphp的时候提示必须要php5.3及以上 本地测试服务器使用的是appserv集成环境 所以要单独升级php 首先到官网下载http://php.net/downloads.php wi ...

  4. passing argument 3 of ‘wtk_hlv_rec_init’ discards ‘const’ qualifier from pointer target type

    -Werror,编译出现如下错误: src/wtk/exam/wtk_ndx.c:154:6: error: passing argument 3 of ‘wtk_hlv_rec_init’ disc ...

  5. Pycharm 使用配置

    配置一下Pycharm吧,不然用着头疼 常用设置: 1. pycharm默认是自动保存的,习惯自己按ctrl + s 的可以进行如下设置: 1). file -> Setting -> G ...

  6. Spring加载resource时classpath*:与classpath:的区别

    http://blog.csdn.net/kkdelta/article/details/5507799   classpath: 第一个匹配的 classpath*:多个组件中的可匹配的

  7. SocketTcpClient

    public class SocketTcpClient { public static string ErrorMsg = string.Empty; private static Socket _ ...

  8. Mysql逻辑模块组成

    总的来说,MySQL可以看成是二层架构,第一层我们通常叫做SQL Layer,在MySQL数据库系统处理底层数据之前的所有工作都是在这一层完成的,包括权限判断,sql解析,执行计划优化,query c ...

  9. Content is not allowed in prolog.解决方法

    将xml配置文件利用记事本另存为Anis编码的文件可以解决.

  10. Linux下实现获取远程机器文件

    创建公钥秘钥实现无密码登录后即可获取到文件内容了!! A:xxx.xxx.6.xxx B:xxx.xxx.xxx.x 一.创建 A机器 ssh-keygen -t rsa 二.拷贝——将生成的公钥复制 ...