Angularjs 角度1到角度5（导入嵌套组件）

以前

• 角度1.5
• 用户界面路由器

现在

• 角度5.0

如何在零部件父亲（如angular 1.5）中导入子零部件？ 我做了angular 5中的英雄教程，但没有解释这个过渡，所有组件都导入到app.modole.ts中

下一幅图试图解释一个小例子，我是如何在angular 1.5中导入的

有人知道如何在新的angular 5中导入组件中的子组件吗？

---

或者绝对有必要导入

应用程序模块中的所有组件。ts

？

组件包含在模块中。因此，一个模块包含并封装1个或多个组件，并使用

exports

关键字将它们“公开”。您将所有服务注入模块中，以便所有组件和子组件都具有相同的实例-单例服务

在创建所需的组件并在模块中声明它们之后，您可以在html模板中将它们用作同级、子组件等。这无关紧要

因此，作为一个示例，如果您有一个

组件，它将是statefull父组件，那么您可以在该模板中添加您需要的任何组件子组件，例如

等。您只需在同一模块中导入所有这些组件

---

编辑：我想这部分文档可以帮助你更好地理解。如果您阅读了CLI命令的功能，则该命令的作用是

。。。（HeroDetailComponent）在AppModule中声明组件。

然后在

heros.component.html

中添加它，就像这样

它与AngularJS在任何方面都没有区别。这可以通过单个应用程序模块（这对于复杂的应用程序是不够的）或模块层次结构来实现

在AngularJS中：

angular.module('app', ['foo'])
.component('app', {...});

angular.module('foo', [])
.component('foo', {...})
.component('barUsedByFoo', {...});

在角度上：

@NgModule({ declarations: [FooComponent, BarUsedByFooComponent], exports: [FooComponent] })
class FooModule {}

@NgModule({ imports: [FooModule], declarations: [AppComponent], bootstrap: [AppComponent] })
class AppModule {}

Angular团队提出了。功能模块应通过

导入

明确指定其对其他模块的依赖性。所有模块组件都在

声明和（可选）导出中指定

与AngularJS的不同之处在于，Angular模块允许具有本地组件。如果在
声明
和
导出
中都指定了带
条形
选择器的
条形组件
，则它将在所有组件模板中可用。如果
BarComponent
仅在
声明中指定，而不是在
导出中指定，则它将仅在该模块的组件模板中可用。这样，不同的模块可以有不同的
，而不会污染全局命名空间

如果
BarComponent
是路由组件，则应在
声明和
导出中指定它，因为这样它将可用于路由器模块。
我不完全理解您的问题，但所有组件都必须在模块中声明。模块可以是
app.module.ts
，也可以是另一个模块（尽管如果模块B声明了一个组件，并且您希望在模块a中使用该组件，模块B必须导出该组件，模块a必须导入模块B），请不要在标题中使用“已解决”。将答案标记为“已接受”，或者如果没有人直接解决您的问题，请回答您自己的问题并将其标记为“已接受”。