首页 > 解决方案 > 何时使用 Angular 指令、组件和模块

问题描述

我一直在阅读文档,但似乎仍然对何时应该使用指令或组件感到困惑......

另外,什么时候最好抽象组件并将它们放入模块中?

标签: angularangular-directiveangular-componentsangular-module

解决方案


事实上,根据角度文档,组件也是一种指令。

Angular中有三种指令:

1. Components—directives with a template.
2. Structural directives—change the DOM layout by adding and removing DOM elements.
3. Attribute directives—change the appearance or behavior of an element,
   component, or another directive.

当您的要求是创建一组可重用的 html 元素时,您可以使用components 。例如,如果您的要求是创建一个 CRUD 屏幕,您可以创建一个组件,它包括一个表格、保存、编辑、删除按钮等。角屏幕也是一个组件或可以由多个组件构成。

如果您的要求是轻松更改现有组件或元素的样式或结构,请使用指令。想想 *ngFor,它是一个结构指令,用于构造一组元素。您还可以使用指令为现有组件提供附加功能。例如,您可以创建一个指令,为表格组件提供过滤或导出支持。

另外,什么时候最好抽象组件并将它们放入模块中?

将组件等放入不同的模块就是模块化。通过这种方式,您可以对彼此相关的事物进行分组,并在需要时通过导入它们来重用它们。例如,当您需要 http 调用时,您导入 http-client-module,该模块包含 http 客户端和相关内容。模块的另一个好处是您可以通过延迟加载模块来减小应用程序的初始大小,这意味着如果您将组件放在延迟加载的模块中,它只会在屏幕中需要(必须使用/显示)时下载


推荐阅读