简体繁体 English

Angular 2 DOM元素，“指令的使用和指令相对于组件的优势

[英]Angular 2 DOM Elements, "Use of Directives and Advantage of Directives over components

原文 2017-07-05 13:10:52 3 1 angular/ angular2-directives

I have just started working on angular 2 and i need to know what are directives and what is the difference between and directives and components. 我刚刚开始研究angular 2，我需要知道什么是指令以及指令和组件之间的区别是什么。 Also i need a basic idea on dom elements in angular 2. 我也需要有关角度2中dom元素的基本概念。

1 个解决方案

A component is a directive-with-a-template and the @Component decorator is actually a @Directive decorator extended with template-oriented features. 组件是带有模板的指令，而@Component装饰器实际上是具有面向模板功能的@Directive装饰器。

Details : http://www.codeandyou.com/2016/01/difference-between-component-and-directive-in-Angular2.html 详细信息： http : //www.codeandyou.com/2016/01/difference-between-component-and-directive-in-Angular2.html

Directive vs Component 指令与组件

Components 组件

To register a component we use @Component meta-data annotation. 要注册组件，我们使用@Component元数据注释。 Component is a directive which uses shadow DOM to create encapsulated visual behavior called components. Component是一个指令，它使用影子DOM创建封装的可视行为（称为组件）。 Components are typically used to create UI widgets. 组件通常用于创建UI小部件。 Component is used to break up the application into smaller components. 组件用于将应用程序分解为较小的组件。 Only one component can be present per DOM element. 每个DOM元素只能存在一个组件。 @View decorator or templateurl template are mandatory in the component. @View装饰器或templateurl模板在组件中是必需的。

Directive 指示

To register directives we use @Directive meta-data annotation. 要注册指令，我们使用@Directive元数据注释。 Directive is used to add behavior to an existing DOM element. 指令用于向现有DOM元素添加行为。 Directive is use to design re-usable components. 指令用于设计可重复使用的组件。 Many directives can be used per DOM element. 每个DOM元素可以使用许多指令。 Directive doesn't use View. 指令不使用View。