双大括号标记{ {}}
绑定的表达式
<html ng-app>
<script src="http://code.angularjs.org/angular-1.0.1.min.js"></script>
最后,标签中的正文是应用的模板,在UI中显示我们的问候语:
Hello {
{'World'}}!结果:结果直接输出World
AngularJS双向数据绑定
<!doctype html>
<html ng-app>
<head>
<script src="http://code.angularjs.org/angular-1.0.1.min.js"></script>
</head>
<body>
Your name: <input type="text" ng-model="yourname" placeholder="World">
<hr>
Hello {
{yourname || 'World'}}!</body>
</html>
{
{yourname || 'World'}}!中的yourname将根据ng-model的值动态的改变,如果ng-model为空,则仅仅输出World语法或指令
Ng-Bing, ng-init
<body ng-app>
<b ng-init="name='crd'"></b>
<div ng-bind="name">dsdfdsf</div>
</body>
Div的值将输出crd 原值dsdfdsf被覆盖
HTML5 允许扩展的(自制的)属性,以 data- 开头。
AngularJS 属性以 ng- 开头,但是您可以使用 data-ng- 来让网页对 HTML5 有效。
带有有效的 HTML5:
AngularJS 实例
<div data-ng-app="" data-ng-init="firstName='John'">
<p>姓名为 <span data-ng-bind="firstName"></span></p>
</div>
结果值同上