Angular.js指令

来源:互联网 发布:淘宝账号怎么绑定手机 编辑:程序博客网 时间:2024/05/21 17:41

Angular.js指令

  •  --AngularJS 指令是扩展的 HTML 属性,带有前缀 ng-。

(1)ng-app 指令初始化一个 AngularJS 应用程序。
(2)ng-init 指令初始化应用程序数据。
(3)ng-model 指令把元素值(比如输入域的值)绑定到应用程序。
为应用程序数据提供类型验证(number、email、required)。
为应用程序数据提供状态(invalid、dirty、touched、error)。
为 HTML 元素提供 CSS 类。
绑定 HTML 元素到 HTML 表单。

(4)ng-repeat 指令对于集合中(数组中)的每个项会 克隆一次 HTML 元素。


创建自定义的指令:


(1)除了 AngularJS 内置的指令外,我们还可以创建自定义指令。
(2)你可以使用 .directive 函数来添加自定义的指令。
(3)要调用自定义指令,HTML 元素上需要添加自定义指令名。
(4)使用驼峰法来命名一个指令, runoobDirective, 但在使用它时需要以 - 分割, runoob-directive:


通过添加 restrict 属性,并设置值为 "A", 来设置指令只能通过属性的方式来调用:
var app = angular.module("myApp", []);
app.directive("runoobDirective", function() {
    return {
        restrict : "A",
        template : "<h1>自定义指令!</h1>"
    };
});


restrict 值可以是以下几种:
E 作为元素名使用
A 作为属性使用
C 作为类名使用
M 作为注释使用
restrict 默认值为 EA, 即可以通过元素名和属性名来调用指令。


可参考博客:http://blog.csdn.net/zhuqinfeng/article/details/52457477





原创粉丝点击