一 引用angularjs
跟普通的js一样在hear标签中引入库文件
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/angular.js"></script>
</head>
<body >
</body>
</html>
二 表达式，model，controllers。
>使用表达式
在angularjs中使用{{}}符号包裹表达式，引入angularjs库后，
应为dom元素标签添加“ng-app”说明表示式有效范围。
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/angular.js"></script>
</head>
<body ng-app>
1+1={{1+1}}<br>
1==2 ?{{1==2}}<br>
{{{name:'Tom',age:18}.name}} <br>
</body>
</html><br><br>
>建立app.js文件，使用angularjs功能MVC
1.建立model，名为myModuel，使用以下代码。
var myModuel = angular.module('myModuel', []);
方法 angluar.module中包含两个参数，一个参数为module的名字（“myModuel”），第二个参数为myModule依赖的module，module可以依赖别的module，
在这个（myModule）module中没有依赖任何的module所以使用了空的数组参数。
2.建立controller，并绑定module。使用以下代码。
var myController = function ($scope) {
}
myModule.controller('myController', myController);
代码中controller的名字为“myController”，名绑定到myModule中。
另外一种写法使用方法链，连续调用。
var myModule =angular.module('myModule',[]).controller('myController',function ($scope) {
})
现在我们在myController定义变量
var myController = function ($scope) {
$scope.message = 'Hello World';
var p= {
name:'Tom',
age:18,
gander:'male'
};
$scope.person =p;
}
3.在HTML中使用，代码如下
<!DOCTYPE html>
<html lang="en" ng-app="myModule" >
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/angular.js"></script>
<script src="js/app.js"></script>
</head>
<body ng-controller="myController" >
{{message}}<br>
name:{{person.name}}<br>
age:{{person.age}}<br>
gander:{{person.gander}}<br>
</body>
</html>
欢迎来到这里！
我们正在构建一个小众社区，大家在这里相互信任，以平等 • 自由 • 奔放的价值观进行分享交流。最终，希望大家能够找到与自己志同道合的伙伴，共同成长。
注册 关于