<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://cdn.staticfile.org/angular.js/1.4.5/angular.min.js"></script> </head> <bodt> <div ng-app=""> <p>名字:<input type="text" ng-model="name"></p> <h1>Hello{{name}}</h1> <p ng-bind="name"></P> </div> </body> </html>
angularjs是一个javaScript框架,它是一个以javaScript编写的库。
AngularJS是以一个javaScript文件形式发布的,可以通过script标签添加到网页中:
我们建议把脚本放在<body>元素的底部。
这会提高网页加载速度,因为HTML加载不受制于脚本加载。
各angular.js版本下载:https://github.com/angular/angular.js/releases
AngularJs扩展了HTML
AngularJS通过ng-directives扩展了HTML
ng-app指令定义一个angularJS应用。
ng-model指令把元素值(比如输入域的值)绑定到应用程序。
ng-bind指令把应用程序数据绑定到HTML视图。
实例讲解:
当网页加载完毕,angularJS自动开启。
ng-app指令告诉AngularJS,<div>元素是AnglarJS应用程序的”所有者“。
ng-model指令把输入域的值绑定到应用程序变量name.
ng-bind指令把应用程序变量name绑定到某个段落的innerHTML.
注意:如果您移除了ng-app指令,HTML将直接将表达式显示出来,不会去计算表达式的结果。