Javascript AngularJS指令-复杂指令名称

我们开始在项目中使用AngularJS，该项目应该很大，并决定使用“模块化”项目结构和命名约定。除了指令外，一切正常

我们对角度组件的命名约定如下：

App.Module.Component.Name

因此，当我注册指令时，它看起来像

App.Module.directive（“App.Module.Directives.DataViewer”，function（）{…}）

指令的问题是，现在我不知道如何在DOM中使用它。

当我将指令限制为“A”并编写HTML
时，当浏览器解析该指令时，该属性为小写，指令不起作用

如果我限制“C”和HTML
，我不知道为什么，但该指令仍然不起作用。我成功使用该指令的唯一方法是camelCase或将所有小写字母用于属性，或仅将camelCase用于类。有什么解决办法吗

我们不考虑“E”指令，因为IE8兼容

感谢
为了在HTML中安全使用，大写字母会自动用驼峰式大小写（HTML不区分大小写，这会导致混淆，因此标准是对HTML属性只使用小写字母）（）

所以

可以这样参考：

<div app.-module.-directives.-dataViewer></div>



请注意，我在“app”中将您的第一个字母小写。
为了在HTML中安全使用，大写字母会自动以驼峰式大写（HTML不区分大小写，这可能会导致混淆，因此标准是对HTML属性仅使用小写）（）

所以

可以这样参考：

<div app.-module.-directives.-dataViewer></div>



注意，我在“app”
 中写下了你的第一封信，应该考虑为应用程序的各个部分创建模块。

您仅使用一个模块初始化页面，该模块与
ng app
匹配。但是，您可以拥有任意数量的模块，并将这些模块注入main
ng app
module

angular.module('App.Module.Component.Name',[])
/* use camelCase for directives*/
.directive('componentNameDataviewer',function....;

var app=angular.module('myApp',['App.Module.Component.Name']);

然后在标记中：

<div component-name-dataviewer></div>

可能只有模块的目的是对注入进行整合，例如只包含指令的模块，或者只包含过滤器的模块，或者服务
应该考虑为应用程序的各个部分创建模块。
您仅使用一个模块初始化页面，该模块与
ng app
匹配。但是，您可以拥有任意数量的模块，并将这些模块注入main
ng app
module

angular.module('App.Module.Component.Name',[])
/* use camelCase for directives*/
.directive('componentNameDataviewer',function....;

var app=angular.module('myApp',['App.Module.Component.Name']);

然后在标记中：

<div component-name-dataviewer></div>

可能有只用于整合注入的模块，例如只包含指令的模块，或只包含过滤器或服务的模块
由于糟糕的约定而在html中添加不必要的点，我当然不会推荐这种命名方案，我喜欢你的方法（+1）但我知道公司是如何以各种理由强制命名的——所以万一他被卡住了……谢谢！！它与属性一起工作。我同意@charlietfl的说法，HTML现在看起来很难看，但至少这是工作。是否有可能解决带有限制“C”的“类”的这种情况？据我所知，没有办法解决第一个字母是大写字母的问题？这将确保您的点约定在所有浏览器中都有效。我知道在jQuery中必须使用选择器中的点转义…这可能是您的directives@charlietfl是的，我认为维护这样的东西是一种痛苦。它可能不适用于css和jQuery…因此我将向我们的CTO展示它，他将决定是否需要这些麻烦：）由于糟糕的约定，在html中添加不必要的点会让人害怕，meI当然不会推荐这种命名方案，我喜欢你的方法（+1）但我知道公司是如何以各种理由强制命名的——所以万一他被卡住了……谢谢！！它与属性一起工作。我同意@charlietfl的说法，HTML现在看起来很难看，但至少这是工作。是否有可能解决带有限制“C”的“类”的这种情况？据我所知，没有办法解决第一个字母是大写字母的问题？这将确保您的点约定在所有浏览器中都有效。我知道在jQuery中必须使用选择器中的点转义…这可能是您的directives@charlietfl是的，我认为维护这样的东西是一种痛苦。它可能不适用于css和jQuery…因此我将向我们的CTO展示它，他将决定是否需要这些头痛：）谢谢，但不幸的是，在我们的情况下，我们没有单一的ng应用程序。我们在同一页上有手动引导的“独立”应用程序。您建议的问题是，我们可以在不同的模块中有两个同名的指令，因此如果两个模块都在应用程序中注册，我们就不能同时使用这两个指令。我们的页面上根本没有ng应用程序。我们有类似的东西：angluar.bootstrap（app1Element，[“App1”]）；英语引导程序（app2Element，[“App2”]）；每个应用程序都有它自己的模块。对…意识到你所说的。。。。仍然认为你的点符号会回来咬在标记虽然谢谢，但不幸的是在我们的情况下，我们没有单一的ng应用程序。我们在同一页上有手动引导的“独立”应用程序。您建议的问题是，我们可以在不同的模块中有两个同名的指令，因此如果两个模块都在应用程序中注册，我们就不能同时使用这两个指令。我们的页面上根本没有ng应用程序。我们有类似的东西：angluar.bootstrap（app1Element，[“App1”]）；英语引导程序（app2Element，[“App2”]）；每个应用程序都有它自己的模块。对…意识到你所说的。。。。仍然认为你的点符号会回来咬标记虽然