<div ng-app="" ng-init="firstName='John'">
<p>在输入框中尝试输入：</p>
<p>姓名：<input type="text" ng-model="firstName"></p>
<p>你输入的为： {{ firstName }}</p>
</div>
1.ng-app:会使<div>中的变量被Angular js 解析
2.ng-init：初始化应用程序数据。 {{ firstName }}是Angular js的数据绑定表达式。
3.ng-model：把元素值（比如输入域的值）绑定到应用程序。
<div ng-app="" ng-init="quantity=4;price=5">
<h2>价格计算器</h2>
数量： <input type="number" ng-model="quantity">
价格： <input type="number" ng-model="price">
<p><b>总价：</b> {{ quantity * price }}</p>
</div>//总价会是20
4.ng-bind：告诉 AngularJS 使用给定的变量或表达式的值来替换 HTML 元素的内容。
如果给定的变量或表达式修改了，指定替换的 HTML 元素也会修改。
<div ng-app="" ng-init="myText='Hello World!'"> <p ng-bind="myText"></p> </div>//运行结果：'Hello World!'
5.ng-repeat ：重复一个 HTML 元素
<div ng-app="" ng-init="names=['1','2','3']">
<ul>
<li ng-repeat="x in names">
{{ x }}
</li>
</ul>
</div> 会遍历显示：1,2,3
6.
<body ng-app="myApp">
<runoob-directive></runoob-directive>
<script>
var app = angular.module("myApp", []);
app.directive("runoobDirective", function() {
return {restrict : "A",
template : "<h1>自定义指令!</h1>"
};
});
</script>
</body> 使用 .directive 函数来添加自定义的指令。在使用它时需要以 - 分割, runoob-directive
通过设置 restrict 属性值为 "A" 来设置指令只能通过 HTML 元素的属性来调用。
2186
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
