问题标签 [angular2-modules]

我得到了一个桶的概念，它可以让你使用 index.ts 约定导入一个目录。

我不明白为什么 index.ts 似乎总是从 component.ts 文件中导出 * 。

它不应该使用 module.ts 文件来获取所有依赖项吗？

我不明白什么？

我有一个 Angular 2 应用程序 (RC7)，它以单个组件开始，但很快以各种不同（有时完全不相关）的方式在整个项目中使用。

因此，单个NgModule引导所有组件似乎是一个糟糕的想法，并且会产生大量膨胀。我正在努力寻找一种拥有多个模块的方法（模块 A 将包含组件 A，模块 B 将包含组件 B 等），并且仍然允许在单个页面上引导多个 A2 应用程序。

在实践中，我想要实现的是：

第 1 页引导模块 A -这有效。

第 2 页引导模块 B -这有效。

第 3 页引导模块 A 和模块 B -这不起作用。

索引.html

systemjs.config.js

AppOne 和 AppTwo 的模块只是简单地引导相关组件（componentOne 和 componentTwo）。但是，两者不会同时呈现在同一页面上。我在控制台中没有错误，但是 systemjs.config.js 文件中最后列出的包是唯一要加载的包。

谁能明白为什么它可能不起作用？或者也许推荐另一种方式来构建我的模块。我宁愿不列出一个包含所有组件、服务等的父模块——这似乎违背了 Angular 2 嵌套组件树的要点，并最终会成倍地影响页面加载时间。

提前致谢。

我已经构建了一个ErrorHandlerLogger，它是一项扩展 ErrorHandler 并将错误消息记录到远程存储库中的服务。

ErrorHandlerLogger需要HttpModule提供的 Angular http客户端。

在ErrorHandlerModule中，我导入HttpModule并将ErrorHandlerLogger定义为提供者。

在AppModule 中，我导入ErrorHandlerModule。

当我启动应用程序时，我收到以下错误消息

这是我的代码

错误处理器模块

错误处理程序记录器

应用模块

很感谢任何形式的帮助

我正在尝试将ng2-ckeditor添加到测试项目中。为此，我在 systemjs.config.js 中添加了以下行

shared.module.ts

app.module.ts

测试模块.ts

但收到错误。

原始异常：CKEDITOR 未定义

所有代码

这是场景。我有一个 UserConsoleModule 和 ShoppingCartModule。我有一个名为 MyProfileComponent 的组件。当您转到 /user-console 时，您会看到 MyProfileComponent，因此我已将其放在 UserConsoleModule 的声明中。现在在 /shopping-cart/profile 中，当用户结账时，我会显示他的个人资料以确保每个信息都正常。所以我重用并将 MyProfileComponent 放在那里，并在 ShoppingCartModule 中声明该组件。现在它说，组件是两个模块的一部分。我不知道为什么它在两个模块中会打扰。他们是独立的。无论我重用什么组件，我都会在那个特定的模块中声明它，我认为我就像 RC 5 之前的声明一样好。这个模块的东西很好，但实际上会造成很多混乱。

另一个问题是路线。我有一个 AdminConsoleModule，我在其中重用了 UserConsoleModule 和 ShoppingCartModule。我所做的是在 AdminConsoleModule 的导入中导入 ShoppingCartModule。我的 /shopping-cart 重定向到 /shopping-cart/cart。因此，一旦管理控制台加载，它就会重定向到 /admin-console/cart。虽然它应该在路由器插座中加载 UserResults。路由器很混乱。我在这里做错了吗？

作为解决方案的一部分，我制作了一个共享模块，它只包含购物车组件，其想法是在 shopping-cart.module 中导入 shared-shopping-cart.module.ts 和 shopping-cart.routing.ts。 ts，使其保持解耦。但是共享模块会抛出一个错误，说 router-outlet not known as my shopping-cart.component.ts 有 router-outlet。

我的 admin-console.routing.ts

我的管理控制台模块：

我没有导入我的个人资料和所有内容，因为 UserConsole 具有这些组件。

用户控制台模块

购物车模块

购物车.routing.ts

在 AdminConsoleModuel 的导入中，如果我将 UserConsoleModule 放在 ShoppingCartModule 之前，那么它会转到 admin-console/my-profile，因为我的 UserConsoleRouting 也有重定向。

这是用户控制台.routing.ts

我认为，最终的解决方案似乎是为每个组件制作一个模块并在任何地方导入它。:p

我目前正在使用 Angular 2.0（发行版）开始一个新项目，我想定义一些全局数据模型/模式。据我了解，Angular 2 没有像这样处理纯数据类的默认方法：

所以我关于最佳实践的第一个问题是：我应该在使用 Angular 2 时定义这样的类吗？

对于我整个应用程序的设计和概念，我认为它们是必要的，但我不确定我是否在这里应用了错误的思维方式。

多个模块（ ngModule ）有时需要这些数据类，所以我的第二个问题是我应该将它们放在我的应用程序中的什么位置？目前我有以下结构：

我的第一个想法是在 import 的每个模块中包含instruction.model.ts并shared.module导出它shared.module。这似乎不起作用，因为模型不是指令、管道或模块。有没有办法导出它？

更简单的解决方案是直接导入test.model.ts文件和每个需要它的模块中的每个其他共享模型。但这对于多个模型来说似乎很笨重且不方便。

我想到的第三种可能的解决方案是将所有共享数据模型放在一个单独的文件夹中，将它们的导出捆绑在一个文件中，如下所示，然后将该文件导入每个需要它的模块中。

在 Angular 2 Style Guide 中，有一个目录结构的建议：https ://angular.io/docs/ts/latest/guide/style-guide.html#04-06

我通常认为这是一个很好的建议，我打算自己做一些非常相似的事情。但是，我遇到了一个问题，我很好奇是否有人解决了它。

请注意，该heroes模块包含一个shared带有heroes-button.component. 大概，我们希望在整个应用程序中使用这个组件（因此，“共享”）。

同样，该villains模块包含一个shared带有villains-button.component.

如果我想在模块和模块中的某个地方使用，那么villains-button.component我最终会得到一个循环引用。heroesheroes-button.componentvillains

简而言之：Angular 不允许我将 ModuleA 导入 ModuleB，并将 ModuleB 导入 ModuleA，但样式指南另有说明。

有人对这种情况有任何解决方案吗？

这是shared我在我的应用程序中共享的模块：

该shared模块导入ModalModule：

然后我有第三个模块，它导入SharedModule（导出ModalModule）：

然后我有这个指令modalOpen：

但是当我在DocumentationListComponent's 模板中使用它时：

我明白了：

为什么它在我的模板中找不到指令？

编辑：我想要的基本上是本指南中的一个功能模块：https ://angular.io/docs/ts/latest/guide/ngmodule.html

在我的应用程序中，我有两个不同的引导模块 ( @NgModule) 在一个应用程序中独立运行。没有一个角度应用程序位独立的引导模块，现在我希望它们应该相互通信并共享数据。

我知道通过@Injectable服务作为模块中的提供者，我可以在所有组件中共享数据，@NgModule但我将如何在两个不同的模块之间共享数据（而不是模块内部的组件）。

有没有办法可以在另一个模块中访问一个服务对象？有没有办法可以访问浏览器内存中可用的服务对象并在我的其他角度模块中使用它？

I am getting the following error, not sure what to do:

(SystemJS) Unexpected directive ViewerComponent imported by the module GalleryModule

Thanks for any help relating to what might be causing the error. In the main app it is importing the gallery module. The gallery component has the viewer component as a child.

Gallery Component:

Gallery Module:

Viewer HTML:

Viewer Component: