Question

我正在尝试采用角度1.5发布的新.component。虽然我现在很难理解模块适合的位置。

在我将组件分成角度模块之前，现在组件在这里有什么关系？

只需创建一个角度模块并在其下添加所有组件，或继续使用角度模块和组件？

文档似乎没有涉及到这一点。如果我仍在使用模块，那么组件的用途是什么，或者如果我使用的是组件，那么使用多于1个模块会是什么？

Answer 1

我在这里同一条船...... 这是我发现的。希望这有助于我们所有人来自Angular Docs：

1. Module ：您可以将模块视为应用程序不同部分的容器 - 控制器，服务，过滤器，指令等。

模块推荐设置

“...我们建议您将应用程序分解为多个模块：

每个功能的模块
每个可重复使用的组件的模块（特别是指令和过滤器，请参阅下面的组件定义; 特殊类型的指令 ）
和应用程序级模块这取决于上述模块并包含任何初始化码。

2. Component ：在Angular中， 是一种特殊的指令 ，它使用更简单的配置用于基于组件的应用程序结构。

组件的优点：

比plain指令更简单的配置
宣传理智默认值和最佳做法
针对基于组件的架构进行了优化
编写组件指令将使其更容易升级到Angular 2

何时不使用组件：

用于需要在编译和预链接函数中执行操作的指令，因为它们不可用
当您需要高级指令定义选项时，例如priority，terminal，multi-element
当您需要由属性或CSS类而不是元素

因此，尝试理解所有这些似乎需要一个模块来组织或作为顶级“容器”，如果你愿意，然后根据需要添加组件/子组件。

angular.module('app',[])
 .component('component')
 .component('common')

这一切都归结为应用程序的组件：

此图片来自angular 2 patterns in angular 1（强烈推荐）

Boottom专栏：Angular 1的doc在这个主题上并不是很明确，但是我们可以将它看作是组织模块/组件的一种方式

模块始终是
我们根据结构添加组件和子组件

文件结构上的ToodMottos推荐

“......我们理想情况下应该有三个高级模块：root，component和common ......”
在这里，我们可以看到模块如何成为组件和子组件

├── app/
│   ├── components/
│   │  ├── calendar/
│   │  │  ├── calendar.module.js
│   │  │  ├── calendar.component.js
│   │  │  ├── calendar.service.js
│   │  │  ├── calendar.spec.js
│   │  │  ├── calendar.html
│   │  │  ├── calendar.scss
│   │  │  └── calendar-grid/
│   │  │     ├── calendar-grid.module.js
│   │  │     ├── calendar-grid.component.js
│   │  │     ├── calendar-grid.directive.js
│   │  │     ├── calendar-grid.filter.js
│   │  │     ├── calendar-grid.spec.js
│   │  │     ├── calendar-grid.html
│   │  │     └── calendar-grid.scss
│   │  ├── events/
│   │  │  ├── events.module.js
│   │  │  ├── events.component.js
│   │  │  ├── events.directive.js
│   │  │  ├── events.service.js
│   │  │  ├── events.spec.js
│   │  │  ├── events.html
│   │  │  ├── events.scss
│   │  │  └── events-signup/
│   │  │     ├── events-signup.module.js
│   │  │     ├── events-signup.component.js
│   │  │     ├── events-signup.service.js
│   │  │     ├── events-signup.spec.js
│   │  │     ├── events-signup.html
│   │  │     └── events-signup.scss
│   │  └── components.module.js
│   ├── common/
│   │  ├── nav/
│   │  │     ├── nav.module.js
│   │  │     ├── nav.component.js
│   │  │     ├── nav.service.js
│   │  │     ├── nav.spec.js
│   │  │     ├── nav.html
│   │  │     └── nav.scss
│   │  ├── footer/
│   │  │     ├── footer.module.js
│   │  │     ├── footer.component.js
│   │  │     ├── footer.service.js
│   │  │     ├── footer.spec.js
│   │  │     ├── footer.html
│   │  │     └── footer.scss
│   │  └── common.module.js
│   ├── app.module.js
│   ├── app.component.js
│   └── app.scss
└── index.html

ToodMottos风格指南： Modular Achitecture（我必须阅读）
以下是 angular Module

Answer 2

Angular 1.5中的组件是特殊类型的指令，适用于基于组件的体系结构。它们更类似于类固醇的指令。

在我将组件分成角度模块之前，现在组件在这里有什么关系？

既然组件在那里，您可以将相关组件分成不同的模块。

只需创建一个角度模块并在其下添加所有组件，或继续使用角度模块和组件？

您可以使用之前使用的相同模式来分离控制器。

angular 1.5中的组件可帮助您创建具有自己的视图和绑定的实际组件。创建它们是为了让1.5开发者能够理解模式，并在以后轻松迁移到Angular 2.0。

Angular 1.5中Angular模块的组件和使用

2 个答案: