您的位置:首页 > Web前端 > AngularJS

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: AngularJS

w3schools: AngularJS Examples
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  angularjs