AngularJS 入门小记（1）
angularJS的意义
angularJS 主要通过新的属性和表达式扩展 HTML
主要用到的指令
-ng-app指令定义一个 AngularJS 应用程序
-ng-model指令把元素值（比如输入域的值）绑定到应用程序
-ng-bind 指令把应用程序数据绑定到 HTML 视图
比如这段代码,
<div ng-app="">
<p>名字 : <input type="text" ng-model="name"></p>
<h1>Hello {{name}}</h1>
</div>-ng-app 指令告诉 AngularJS，div 元素是 AngularJS 应用程序 的”所有者”。
-ng-model 指令把输入域的值绑定到应用程序变量 name。可以看作是var name=$(‘input’).value。
-ng-bind 指令把应用程序变量 name 绑定到某个段落的 innerHTML。
-此处{{ }}效果与ng-bind类似
此处可以改成，
<div ng-app="">
<p>名字 : <input type="text" ng-model="name"></p>
<h1>Hello <span ng-bind="name"></span></h1>
</div>
-此外，还有一个不常用的指令ng-init，可以初始化变量值的指令
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}">
<p>姓为 {{ person.lastName }}</p>
</div> -如果要写循环，可以使用ng-repeat指令
<div ng-app="" ng-init="names=['Jani','Hege','Kai']">
<p>使用 ng-repeat 来循环数组</p>
<ul>
<li ng-repeat="x in names">
{{ x }}
</li>
</ul>
</div>创建自定义的指令
除了 AngularJS 内置的指令外，我们还可以创建自定义指令。
可以使用 .directive 函数来添加自定义的指令。
要调用自定义指令，HTML 元素上需要添加自定义指令名。
使用驼峰法来命名一个指令， runoobDirective, 但在使用它时需要以 - 分割, runoob-directive,
<body ng-app="myApp">
<runoob-directive></runoob-directive>
<script>
var app = angular.module("myApp", []);
app.directive("runoobDirective", function() {
return {
template : "<h1>自定义指令!</h1>"
};
});
</script>
</ody>共有4种方式可以用来调用指令
分别是：元素名、属性、类名、注释，此处示例为元素名
今天就到这里了，明天写更细节的
146
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
