AngularJS Step by Step (1) : Hello Angular
2015-07-31 23:54
639 查看
AngularJS简介
AngularJS是当下最热门的Web前端JavaScript框架之一,它可以有效地在Web前端实现MVC / MVVM设计模式。Wikipedia: AngularJS
用AngularJS写一个Hello World
学习写程序,通常的步骤是从Hello World开始。先写一个静态的HTML页面:
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> </head> <body> <div> <p>Hello, world!</p> </div> </body> </html>
现在我们把它改成AngularJS版:
HTML页面:
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <script src="js/anjular/v1.4.3/angular.min.js"></script> <script src="js/controllers/page01.js"></script> </head> <body ng-app="myApp"> <div ng-controller="myCtrl"> <p>Hello, {{greeting.text}}!</p> </div> </body> </html>
JavaScript文件:page01.js
var app = angular.module('myApp', []); app.controller('myCtrl', function($scope) { $scope.greeting = { text: 'Angular' }; });
用浏览器查看这个页面:
参考文章
wikipedia: AngularJSw3schools: AngularJS Examples
相关文章推荐
- angularJS 中$attrs方法使用指南
- 简述AngularJS相关的一些编程思想
- AngularJS的一些基本样式初窥
- 创建你的第一个AngularJS应用的方法
- 详解AngularJS中的作用域
- 简介AngularJS的视图功能应用
- AngularJS语法详解
- angularjs中的e2e测试实例
- 简介AngularJS中使用factory和service的方法
- AngularJS + Node.js + MongoDB开发的基于高德地图位置的通讯录
- 举例讲解AngularJS中的模块
- 使用AngularJS处理单选框和复选框的简单方法
- AngularJS的内置过滤器详解
- 详解AngularJS中自定义指令的使用
- 使用Raygun来自动追踪AngularJS中的异常
- angularJS结合canvas画图例子
- 教你用AngularJS框架一行JS代码实现控件验证效果
- AngularJS入门教程(零):引导程序
- AngularJS基础学习笔记之简单介绍
- 简介AngularJS的HTML DOM支持情况