早期的AngularJS使我们的前端开发模式发生很大的变化,基使用MVC。 Model - html 模板;Controller - js脚本; Model 来自于Web API 或其他Service的 JSON 或XML数据。随着$scope的引用,现在的AngularJS越来越像MVVM了. 支持双向绑定,依懒注入等各种MVVM的特性。这方面的介绍,网上很多,就不多说了。

上代码,我的第一个 Angular JS. Hello world.

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="angular.js"></script>
<title>Hello World</title>
</head>
<body>
<div ng-app>
<input ng-model="text" type="text" placeholder="please input.." />
<h2>Hello {{text || 'world'}}</h2>
</div>
</body>
</html>

ng-app: 作用域。此标记指示angular js只处理该<div>标记内的DOM。一个html页面中可以有一个或多个 ng-app.

ng-model: 数据绑定,当前数据绑定为双向绑定。

有兴趣的朋友,可以拷出去自己试一下。angular.js文件。请自行下载。

AngularJS 学习(-)Hello world的更多相关文章

  1. Angularjs学习---官方phonecat实例学习angularjs step0 step1

    接下来一系列的文章都是学习https://docs.angularjs.org/tutorial的笔记,主要学习的angular-phonecat项目的实现,来介绍angularjs的使用. 1.下载 ...

  2. angularJS学习资源最全汇总

    基础 官方: http://docs.angularjs.org angularjs官方网站已被墙,可看 http://www.ngnice.com/: 官方zip下载包 https://github ...

  3. 我的AngularJS 学习之旅

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

  4. 推荐10个很棒的AngularJS学习指南

    AngularJS 是非常棒的JS框架,能够创建功能强大,动态功能的Web app.AngularJS自2009发布以来,已经广泛应用于Web 开发中.但是对想要学习Angular JS 的人而言,只 ...

  5. Angularjs学习---ubuntu12.04中karma安装配置中常见的问题总结

    karma启动时出现了很多问题: 1.安装karma前提条件 安装karma首先要安装nodejs,npm然后才可以安装karma.nodejs,npm的安装过程可以参考文章:Angularjs学习- ...

  6. AngularJs学习总结-了解基本特性(-)

    现在的前端项目中基本上都会用到angularjs框架,之前并不了解这个框架,也是因为最近接手的项目,所以打算好好的学习下它.之前都是搞pc端,现在接手的是移动端的项目,移动端UI框架用的是ionic+ ...

  7. [整理]AngularJS学习资源

    https://angular.io/docs/js/latest/(2.0官方网站) http://www.linuxidc.com/Linux/2014-05/102139.htm(Angular ...

  8. AngularJs学习笔记--Forms

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/forms 控件(input.select.textarea)是用户输入数据的一种方式.Form(表单) ...

  9. AngularJs学习笔记--expression

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/expression 表达式(Expressions)是类Javascript的代码片段,通常放置在绑定 ...

  10. AngularJs学习笔记--directive

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/directive Directive是教HTML玩一些新把戏的途径.在DOM编译期间,directiv ...

随机推荐

  1. python添加图片验证码

    1.创建验证码模块 #!/usr/bin/env python # -*- coding:utf-8 -*- import random from PIL import Image, ImageDra ...

  2. 【bzoj1853】: [Scoi2010]幸运数字 数论-容斥原理

    [bzoj1853]: [Scoi2010]幸运数字 预处理出所有幸运数字然后容斥原理 但是幸运数字是2logn个数的 直接搞会炸 所以把成倍数的处理掉 然后发现还是会T 所以数字要从大到小处理会快很 ...

  3. javascript小菜单—demo

    <!DOCTYPE html><html><head> <title></title></head><body>&l ...

  4. tftp简单文件传输协议搭建

    TFTP 简单文件传输协议     安装     sudo apt-get install tftp  tftpd openbsd-inetd     需要tftp tftpd openbsd-ine ...

  5. logrotate 日志管理

    查看logrotate 是否已安装 因为linux安装软件的方式比较多,所以没有一个通用的办法能查到某些软件是否安装了.总结起来就是这样几类: 1.rpm包安装的,可以用rpm -qa看到,如果要查找 ...

  6. Luogu P5122 [USACO18DEC]Fine Dining 最短路

    先跑一遍n为起点最短路,再新开一个点,向有干草垛的点连一根边权为d[u]-w的有向边(很重要..我当时连的无向边,然后我死了.),相当于用价值抵消一部分边权, 然后以这个新的点为起点跑最短路就好了.. ...

  7. input keyup的时候实现内容过滤

    当在文本框中输入关键字,就会搜索出包含关键字的数据 实现: 只需要一个内容过滤即可 <body> <input type="text" id="sear ...

  8. shell入门基础必备

    作者:KornLee 2005-02-03 15:32:57 来自:Linux先生    1.建立和运行shell程序   什么是shell程序呢? 简单的说shell程序就是一个包含若干行 shel ...

  9. Html5的datetime-local控件

    参考http://stackoverflow.com/questions/7815232/html5-input-type-datetime-vs-datetime-local-which-shoul ...

  10. SpringMVC DeferedResult和servlet3.1 AsyncContext异步请求

    先看一个简单的示例: @RequestMapping("/getFuture") public Future<String> getFuture() { System. ...