Описание тега angular2-components

В Angular 2 компоненты - это основной способ создания и определения элементов и логики на странице. Вопросы должны включать примеры кода, достаточные для воспроизведения проблемы.

Документация по компонентам:

Объявите повторно используемые строительные блоки пользовательского интерфейса для приложения.

Для каждого компонента Angular требуется одна аннотация @Component. Аннотация @Component указывает, когда компонент создается, а также к каким свойствам и hostListeners он привязывается.

Когда компонент создается, Angular

создает теневой DOM для компонента. загружает выбранный шаблон в теневой DOM. создает все инъекционные объекты, настроенные с помощью поставщиков и viewProvider. Затем все выражения и операторы шаблона сравниваются с экземпляром компонента.

Пример компонента Hello World

import { Component, Input } from '@angular/core';
@Component({
    selector: 'hello-world',
    template: `Hello {{name}}`
})
export class HelloWorldComponent{
    @Input() name: string;
}

Использование:

<hello-world [name]="'world'"></hello-world>