AngularJS 指令
-
定义和描述
AngularJS 指令是带有前缀ng-的扩展HTML属性。AngularJS 具有一组内置指令,这些指令为您的应用程序提供功能。AngularJS 还允许您定义自己的指令。ng-app
指令会初始化AngularJS应用程序。ng-init
指令初始化应用程序数据。ng-model
指令将HTML控件的值(input, select, textarea)绑定到应用程序数据。ng-app
指令还告诉AngularJS <div> 元素是AngularJS应用程序的“所有者”。 -
数据绑定
所述的 {{ firstName }} 表达,在上述的例子中,是一个AngularJS数据绑定表达式。{{ firstName }} 与 {{ ng-model = "firstName" }} 绑定。在下一个示例中,两个文本字段与两个ng-model
指令绑定在一起:使用
ng-init
并不是很常见。 在关于控制器的章节中,您将学到更好的初始化数据的方法。 -
-
ng-app 指令
ng-app
指令定义AngularJS应用程序的根元素。加载网页后,ng-app
指令将自动引导(自动初始化)应用程序。 -
ng-init 指令
ng-init
指令定义AngularJS应用程序的初始值。通常,您不会使用ng-init
。 您将改为使用控制器或模块。下面您将了解有关控制器和模块的更多信息。
-
ng-model 指令
ng-app
指令将HTML控件的值(input, select, textarea)绑定到应用程序数据。ng-model
指令还可以:- 提供应用程序数据(number、email、required)的类型验证。
- 提供应用程序数据的状态(invalid, dirty, touched, error)。
- 提供HTML元素的CSS类。
- 将HTML元素绑定到HTML表单。
在下一章中阅读有关ng-model指令的更多信息。
-
-
限制条件
您可以限制指令仅由某些方法调用。通过添加值为 "A" 的restrict属性,该指令只能由属性调用:限制值为:E
为元素名称A
为属性C
为类名称M
为注释
默认情况下,该值为EA,这意味着元素名称和属性名称均可调用该指令。有关完整的AngularJS指令参考,请访问我们的AngularJS参考手册。