AngularJS,ng-click vs ng:点击vs ngClick

时间:2022-03-21 18:57:27

I'm learning AngularJS, and I'm a little confused by the different usages of directives that I'm coming across.

我正在学习AngularJS,我对我遇到的指令的不同用法感到有些困惑。

For example, sometimes I see something like (ng colon click):

例如,有时我会看到类似(ng冒号点击)的内容:

<tr ng:click="..." ...>

sometimes I see (ng dash click):

有时我看到(ng dash click):

<tr ng-click="..." ...>

and in the Angular docs, directives are shown as "ngClick" (camelcase with no dash or colon). Additionally, in some places, I've seen: data-ng-click

在Angular文档中,指令显示为“ngClick”(没有破折号或冒号的camelcase)。另外,在某些地方,我见过:data-ng-click

What's the difference between these different forms?

这些不同形式之间有什么区别?

2 个解决方案

#1


9  

No difference, it all depends on your style of programming. ng-click, I think, is by far the most popular style.

没有区别,这一切都取决于你的编程风格。我认为,ng-click是迄今为止最受欢迎的风格。

When you're creating your own directive, you should always camelcase it in the javascript, and then when you put it on an element in your html you should use the lowercase version separated by your favorite flavor. I always do it like so:

当你创建自己的指令时,你应该总是在javascript中使用它,然后当你把它放在你的html元素中时,你应该使用由你喜欢的味道分隔的小写版本。我总是这样做:

angular.module('Test', []).directive('testDirective', function(){

});

and then:

接着:

<div test-directive></div>

From the angular docs:

从角度文档:

Best Practice: Prefer using the dash-delimited format (e.g. ng-bind for ngBind). If you want to use an HTML validating tool, you can instead use the data-prefixed version (e.g. data-ng-bind for ngBind). The other forms shown above are accepted for legacy reasons but we advise you to avoid them.

最佳实践:首选使用以划线分隔的格式(例如ng-bind用于ngBind)。如果要使用HTML验证工具,则可以使用数据前缀版本(例如,ngBind的data-ng-bind)。上面显示的其他表单因遗留原因而被接受,但我们建议您避免使用它们。

#2


4  

ng-click, ng:click and ngClick are all the same for AngularJS, you can use whichever one you prefer, though I think ng-click is how you'll usually see it being used.
data- is an HTML5 prefix you can use to embed custom data, it helps making sure your HTML passes validation and keeping some IDEs from showing errors for unknown attributes.

ng-click,ng:click和ngClick对于AngularJS都是一样的,你可以使用你喜欢的任何一个,不过我认为ng-click是你通常会看到它被使用的方式。 data-是可用于嵌入自定义数据的HTML5前缀,它有助于确保HTML通过验证并使某些IDE无法显示未知属性的错误。

#1


9  

No difference, it all depends on your style of programming. ng-click, I think, is by far the most popular style.

没有区别,这一切都取决于你的编程风格。我认为,ng-click是迄今为止最受欢迎的风格。

When you're creating your own directive, you should always camelcase it in the javascript, and then when you put it on an element in your html you should use the lowercase version separated by your favorite flavor. I always do it like so:

当你创建自己的指令时,你应该总是在javascript中使用它,然后当你把它放在你的html元素中时,你应该使用由你喜欢的味道分隔的小写版本。我总是这样做:

angular.module('Test', []).directive('testDirective', function(){

});

and then:

接着:

<div test-directive></div>

From the angular docs:

从角度文档:

Best Practice: Prefer using the dash-delimited format (e.g. ng-bind for ngBind). If you want to use an HTML validating tool, you can instead use the data-prefixed version (e.g. data-ng-bind for ngBind). The other forms shown above are accepted for legacy reasons but we advise you to avoid them.

最佳实践:首选使用以划线分隔的格式(例如ng-bind用于ngBind)。如果要使用HTML验证工具,则可以使用数据前缀版本(例如,ngBind的data-ng-bind)。上面显示的其他表单因遗留原因而被接受,但我们建议您避免使用它们。

#2


4  

ng-click, ng:click and ngClick are all the same for AngularJS, you can use whichever one you prefer, though I think ng-click is how you'll usually see it being used.
data- is an HTML5 prefix you can use to embed custom data, it helps making sure your HTML passes validation and keeping some IDEs from showing errors for unknown attributes.

ng-click,ng:click和ngClick对于AngularJS都是一样的,你可以使用你喜欢的任何一个,不过我认为ng-click是你通常会看到它被使用的方式。 data-是可用于嵌入自定义数据的HTML5前缀,它有助于确保HTML通过验证并使某些IDE无法显示未知属性的错误。