AngularJs也是一个MVVM的前端js框架。
指令：ng-app/ng-init
ng-app：1.启动angularjs框架；2.告诉angularjs框架从ng-app指令所在标签的开始到结束之间的所有DOM元素都由angularjs框架管理。
注意：1.ng-app一般放在html标签内，用于告诉angularjs框架，整个页面都由angularjs管理；
<html ng-app>
<head>
<title>Kong's Website</title>
<script src="~/Scripts/angular.js"></script>
</head>
<body>
<div>{{"hello world!"}}</div>
<div>{{"hello angularjs!"}}</div>
</body>
</html>
运行结果为：
hello world!
hello angularjs!
2.一个页面默认加载第一个ng-app
<html >
<head>
<title>Kong's Website</title>
<script src="~/Scripts/angular.js"></script>
</head>
<body>
<div ng-app>{{"hello world!"}}</div>
<div ng-app>{{"hello angularjs!"}}</div>
</body>
</html>
运行结果为
hello world!
{{"hello angularjs!"}}
ng-init：初始化作用域
<html ng-app>
<head>
<title>Kong's Website</title>
<script src="~/Scripts/angular.js"></script>
</head>
<body ng-init="person={'name':'jane'};arr=['angularjs','jquery','dojo']">
<div>{{person.name}}</div>
<div>{{arr[0]}}</div>
</body>
</html>
运行结果：
jane
angularjs
ng-model:从作用域到视图，从视图到作用域的双向绑定
<head>
<title>Kong's Website</title>
<script src="~/Scripts/angular.js"></script>
</head>
<body>
<div>用户名：<input type="text" name="uname" ng-model="uname" /></div>
<div><span id="info">{{uname}}</span></div>
</body>
</html>
ng-bind:从作用域到视图的单向绑定
<html ng-app>
<head>
<title>Kong's Website</title>
<script src="~/Scripts/angular.js"></script>
</head>
<body>
<div>用户名：<input type="text" name="uname" ng-model="uname" /></div>
<div><span id="info" ng-bind="uname"></span></div>
</body>
</html>
在绑定值，不需要进行运算处理以及使用过滤器对输出内容进行处理时，ng-bind可以代替{{}}
表达式：{{}} 双大括号中间的部分，比如上述的person.name 和arr[0]