如何共享跨在AngularJS多个模块的单一指令 [英] How to share a single Directive across multiple modules in AngularJS

问题描述

据我了解AngularJS，这就是今天的有趣的图书馆出来之一。我慢慢了解了角功率，和我很认真地爱它。我有几个疑问，我希望我会得到他们澄清。即使在一些后台的工作，我无法理解他们怎么可以做到

1. 例如我在我的应用程序的模块，并且我有它写指令，我想几个模块添加到我的应用程序，也想重用另一个模块编写的现有指令。我怎样才能做到这一点。不仅适用于过滤器模块，配置等。




2. 我能有一个模块内定义的子模块？




3. 我如何能控制器添加到一个元素动态的，它不应该是一成不变的，即通过HTML标记 NG-控制器。




4. 如果我想在所有的模块我怎么能做到这一点。例如我在我的应用程序的所有模块之外定义一个变量，我只是想访问它们的内部模块共享的东西。是的可能的话，我有这样的疑问，因为它完全靠个人的范围，共享范围和rootScope等。

工作

任何帮助将是AP preciated。

解决方案

  

问：比如我有我的应用程序的模块，我有写指令
  对于这一点，我想几个模块添加到我的应用程序，也希望
  重复使用另一个模块编写的现有指令。我怎么能
  实现这一目标。不仅适用于过滤器模块，配置等。

当你声明一个模块时，需要指定它的依赖。所以，如果你有一个指令是这样的：

angular.module（'moduleA'，[]）.directive（'myDirective'，函数（）{
  // ...
}）;


您可以要求从另一个模块，模块：

angular.module（'moduleB'，['moduleA']）;


该阵列参数 angular.module 是依赖列表。

  

问：我能要一个模块内定义的子模块

模块在技术上都独立的，但它的超级共同捏造事实。因此，我们可以定义 moduleA 与它的子模块像这样：

angular.module（'moduleA.one'，[]）;
angular.module（'moduleA.two'，[]）;angular.module（'moduleA'，[
  moduleA.one'，
  moduleA.two
]）;


和很明显的开发者/读者 moduleA.one 和 moduleA.two 是<一部分code> moduleA ，也随时另一个模块依赖于 moduleA ，它的两个子模块将被包括在内。

但在技术上，这些都是独立的，所以 moduleB 也可以要求 moduleA.two ，如果它想做的事左右。

  

问：我如何才能控制器添加到一个元素动态的，它不应该
  静态的，即通过HTML标记NG-控制器。

这可能不是一个好主意。该意见是官方记录。什么是您的使用情况？

  

Q：如果我想在所有的模块我该怎么做共享的事情。对于
  例如，我有我的应用程序之外定义的所有模块的变量
  我只是想访问它们的内部模块..这是可能的，我有
  这无疑是因为它完全适用于各个领域，共享
  范围和rootScope等。

我不知道我理解你的要求。但是，当你在一个模块中定义的东西，你可以从任何其他只是要求其访问，如上所述。但是在一个AngularJS应用程序，应该有什么的的所有模块外 - 一切都应该是在一个模块中，否则it'ts在全球范围内（如窗口中定义的），而这仅仅是不好的做法。

---

要获得更好的理解模块可以如何构建以很大的好处，看看我的 ngBoilerplate Kickstarter的：的 http://ngbp.github.io/ngbp/ 。该模块的结构是专为code再利用的设计，并演示了许多这些概念在实践中。

随意阐述任何这些，我将修改的响应。

As far as I know about AngularJS, this is one of the interesting libraries out today. I am slowly understanding the Angular power, and I am seriously loving it. I have a few doubts and I hope I will get them clarified. Even after some background work, I am unable to understand how they can be done

1. For example I have a module in my App and I have directives written for it, And I want to add few more modules to my app and also want to reuse existing directives written for another module. How I can achieve that. Not only modules that applies to filters, config etc..

2. Can I have sub modules defined inside a Module?

3. How can I add a controller to an element dynamically, it should not be static, i.e through html markup ng-controller.

4. If I want to share a thing across all modules how can I do that.. For example I have a variable defined outside of all modules in my app and I just want to access them inside modules.. Is that possible, I have this doubt because it completely works on individual scopes, shared scope and rootScope etc..

Any help would be appreciated.

解决方案

Q: For example I have a module in my App and I have directives written for it, And I want to add few more modules to my app and also want to reuse existing directives written for another module. How I can achieve that. Not only modules that applies to filters, config etc..

When you declare a module, you specify its dependencies. So if you have a directive like this:

angular.module( 'moduleA', [] )

.directive( 'myDirective', function () {
  // ...
});

You can require that module from another module:

angular.module( 'moduleB', [ 'moduleA' ] );

The array argument to angular.module is a list of dependencies.

Q: Can I have sub modules defined inside a Module?

Modules are technically all independent, but it's super common to fake it. So we can define moduleA with it's "submodules" like so:

angular.module( 'moduleA.one', [] );
angular.module( 'moduleA.two', [] );

angular.module( 'moduleA', [
  'moduleA.one',
  'moduleA.two'
]);

And it's clear to the developer/reader that moduleA.one and moduleA.two are part of moduleA, but also anytime another module depends on moduleA, its two submodules will be included as well.

But technically, these are all independent, so moduleB could also require moduleA.two if it wanted to do so.

Q: How can I add a controller to an element dynamically, it should not be static, i.e through html markup ng-controller.

This is probably not a good idea. The "view" is the official record. What's your use case?

Q: If I want to share a thing across all modules how can I do that.. For example I have a variable defined outside of all modules in my app and I just want to access them inside modules.. Is that possible, I have this doubt because it completely works on individual scopes, shared scope and rootScope etc..

I am not sure I understand what you're asking. But when you define something in a module, you can access it from any other just by requiring it, as discussed above. But in an AngularJS app, there should be anything "outside of all modules" - everything should be in a module because otherwise it'ts defined in the global scope (e.g. window) and that's just bad practice.

---

To get a better understanding of how modules can be structured to great benefit, check out my ngBoilerplate kickstarter: http://ngbp.github.io/ngbp/. The module structure is specifically designed for code reuse and demonstrates many of these concepts in practice.

Feel free to elaborate on any of these and I will revise the responses.

这篇关于如何共享跨在AngularJS多个模块的单一指令的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！