手册
目录
AngularJS 应用程序通常有一个数据模型。数据模型是可用于应用程序的数据的集合。
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.firstname = "Bill";
$scope.lastname = "Gates";
});
显示 AngularJS 应用程序的 HTML 容器称为视图。
视图可以访问模型,并且有几种方式可以在视图中显示模型数据。
您可以使用 ng-bind 指令,它会将元素的 innerHTML 绑定到指定的模型属性:
运行实例 »
点击 "运行实例" 按钮查看在线实例
您还可以使用双大括号 {{ }} 来显示模型中的内容:
运行实例 »First name: {{firstname}}
点击 "运行实例" 按钮查看在线实例
或者,您可以在 HTML 控件上使用 ng-model 指令将模型绑定到视图。
使用 ng-model 指令将模型中的数据绑定到 HTML 控件(input, select, textarea)的视图上。
运行实例 »
点击 "运行实例" 按钮查看在线实例
ng-model 指令提供了模型和视图之间的双向绑定。
AngularJS 中的数据绑定是模型和视图之间的同步。
当模型中的数据发生变化时,视图会反映这种变化,而当视图中的数据发生变化时,模型也会更新。这是立即且自动发生的,从而确保模型和视图始终得到更新。
运行实例 »Name:{{firstname}}
点击 "运行实例" 按钮查看在线实例
AngularJS 中的应用程序由控制器控制。请在 AngularJS 控制器一章中阅读有关控制器的内容。
由于模型和视图的即时同步,控制器可以与视图完全分离,而只需专注于模型数据。由于 AngularJS 中的数据绑定,视图将反映控制器中所做的任何更改。
运行实例 »{{firstname}}
点击 "运行实例" 按钮查看在线实例
相关
视频
RELATED VIDEOS
科技资讯
1
2
3
4
5
6
7
8
9
精选课程
共5课时
17.2万人学习
共49课时
77万人学习
共29课时
61.7万人学习
共25课时
39.3万人学习
共43课时
71万人学习
共25课时
61.6万人学习
共22课时
23万人学习
共28课时
33.9万人学习
共89课时
125万人学习