AngularJs 指令命名约定

Question

当定义 angularJs 指令时，我们必须以“camelCase”语法的形式命名它，但是当我们使用它时，我们必须以“camel-case”的形式命名它。问题是为什么需要这样做？

我知道这是为了避免命名冲突(现在/将来)，但是为什么我们在定义和使用时必须以不同的方式命名它。我们不能直接以 'camel-case' 的形式定义它吗？

Answer 1

它之所以重要有两个原因。

首先，HTML属性不区分大小写，这意味着“someName”和“somename”是同一个属性。因此，最好的风格是使用“kebab-case”表示法来分隔属性名称中的单词。这就是为什么我们对 HTML 属性和标记名称使用“属性名称”语法。

另一方面，短横线命名在 Javascript 中不是有效的标识符，因此为了将此类名称用作 Angular 指令，我们必须使用详细的 bracket notation 。但由于在 Javascript 世界中驼峰命名法实际上是命名变量和对象属性的标准，因此 Angular 使用 normalization (see source)将短横线命名法转换为驼峰命名法，反之亦然。