Question

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

我们对角度组件的命名约定如下：
App.Module.Component.Name

因此，当我注册该指令时，它看起来像App.Module.directive("App.Module.Directives.DataViewer",function(){...});

指令的问题，现在我不知道如何在DOM中使用它。
当我将指令限制为“A”并编写HTML <div App.Module.Directives.DataViewer></div>时，那么当它被浏览器解析时，属性是小写的，而指令不起作用。

如果我限制“C”和HTML <div class="App.Module.Directives.DataViewer"></div>，我不知道为什么，但该指令仍然不起作用。我成功使用该指令的唯一方法是使用camelCase或使用全部小写的属性，或者只使用类中的camelCase。对此有什么解决方案吗？

由于IE8兼容性，我们不考虑“E”指令。

由于

Answer 1

资本是自动骆驼在HTML中安全使用（HTML不区分大小写会导致混淆，所以标准是只使用小写的HTML属性）（http://docs.angularjs.org/guide/directive）。

所以

App.Module.directive("app.Module.Directives.DataViewer",function(){...});

可以像这样引用：

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

请注意，我在“app”

中缩小了您的第一个字母

Answer 2

应该考虑为应用的各个部分创建模块。

您只使用一个模块来初始化页面，一个匹配ng-app。您可以拥有任意数量的模块，并将其注入主ng-app模块

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

然后在标记中：

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

然后在主ng-app模块

中注入模块

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

唯一目的的模块是否也可以整合注入，例如仅包含指令的模块，或仅包含过滤器或服务的模块

AngularJS指令 - 复杂指令名称

2 个答案: