AngularJS是以数据做为驱动的MVC框架,所有模型(Model)里的数据经由控制器(Controller)展示到视图(View)中。
所谓数据绑定指的就是将模型(Model)中的数据与相应的视图(View)进行关联,AngularJS当中的数据绑定分为:
1.数据单向绑定
单向数据绑定是指将模型(Model)数据,按着写好的视图(View)模板生成HTML标签,然后追加到DOM中显示,如之前所学的artTemplate 模板引擎的工作方式。2.数据双向绑定
双向绑定则可以实现模型(Model)数据和视图(View)模板的双向传递,
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
[ng-cloak]{
display: none;
}
</style>
</head>
<body ng-app="app" ng-controller="xmgController">
<!--
数据单向绑定:把模型中的数据展示到视图当中
绑定方式:
1.{{属性}} 插值语法 会闪烁 可以绑定多个值
2.ng-bind='属性' 不会闪烁 只能绑定一个值
3.ng-blind-template 不会闪烁 可以版定多个值
-->
<p>{{name}}</p>
<p ng-cloak>{{name}}--**-- {{age}}</p>
<p ng-bind="name"></p>
<p ng-bind-template="{{name}}--{{age}}"></p>
</body>
<script src="js/angular.js"></script>
<script>
//1.创建模块
var app = angular.module('app', []);
//2.创建控制器
app.controller('xmgController', ['$scope', function ($scope) {
$scope.name = "xmg";
$scope.age = 20;
}]);
//3.绑定模块 ng-app="app"
//4.绑定控制器 ng-controller="xmgController"
</script>