AngularJS指令中的命名约定

12

这个对我有用(服务端验证示例):

AngularJS:与服务端验证集成

但是,我决定提出额外的问题。

在那个示例中,我们使用了 unique-email 指令:

<input type="email" ng-model="userEmail" name="userEmail" required unique-email/>

但是在创建指令时,我们使用了uniqueEmail

app.directive('uniqueEmail', function($http) { ..

为什么?这与命名规则有关吗?Angular如何知道在哪里查找以及如何将一个连接到另一个?

我很好奇,因为当我使用<input ... required uniqueEmail时,它不起作用。直到我键入"unique-email"。

如果我输入以下内容:

app.directive('unique-email', function($http) {

在我输入uniqueEmail之前,它将无法工作。

因此,在使用指令和定义指令时不能使用相同的样式名称。

2个回答

19

来自这里

指令具有驼峰式名称,例如ngBind。 可以通过使用这些特殊字符:,-或_将驼峰式名称翻译成蛇形命名法来调用指令。可以选择地,在指令前添加x-或data-以使其符合HTML验证器的规范。

所以,是的,这是Angular的惯例。


那么在使用指令和定义指令时,没有机会使用相同的样式名称吗? - ses

5

HTML的常规约定是使用小写字母来标记和定义属性(这部分原因是因为HTML5不区分大小写。 class = ""与ClaSS = ""相同)。Angular不想限制您的指令名称为小写字母。因此,它允许在Angular中使用大写字母,并处理将这些名称转换为HTML标准蛇形命名。

因此,在Angular中,您可以获得命名灵活性和可读性的提高,同时保持符合HTML命名标准。

请注意,如果您只使用小写字母名称,则无需担心名称转换。当然,这可能会损害您的Angular代码的可读性。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接