Яка різниця між кутовим компонентом і модулем

Я дивився відео та читав статті, але ця конкретна стаття робить мене таким розгубленим, на початку статті йдеться

Програми Angular дотримуються модульної структури. Кутові програми містять багато модулів, кожен присвячений єдиній цілі. Зазвичай модуль - це згуртована група коду, яка інтегрована з іншими модулями для запуску ваших програм Angular.

Модуль експортує деякі класи, функції та значення зі свого коду. Компонент - це фундаментальний блок кутових, і ваш додаток складатиме кілька компонентів.

Модуль може бути бібліотекою для іншого модуля. Наприклад, бібліотека angular2 / core, яка є основним модулем кутової бібліотеки, буде імпортована іншим компонентом.

Вони обмінні умови? Чи є компонент модулем? Але не віверверса?

Компоненти контролюють перегляди (html). Вони також спілкуються з іншими компонентами та послугами, щоб забезпечити функціональність вашому додатку.

Модулі складаються з одного або декількох компонентів. Вони не контролюють жоден html. Ваші модулі декларують, які компоненти можуть використовуватися компонентами, що належать до інших модулів, які класи будуть введені інжектором залежності та який компонент завантажується. Модулі дозволяють керувати своїми компонентами, щоб внести модульність у ваш додаток.

Що ж, надто пізно розмістити відповідь, але я відчуваю, що буде легко зрозуміти, хто є початківцями з Angular. Далі - один із прикладів, які я наводжу під час своєї презентації.

Розгляньте своє кутове застосування як будівлю. У будинку може бути Nкількість квартир. Квартира розглядається як модуль. Потім Квартира може мати Nкількість кімнат, які відповідають будівельним блокам кутового додатка з назвою компонентів.

Тепер кожна квартира (Модуль) `матиме кімнати (Компоненти), ліфти (Послуги), що дозволяють збільшувати переміщення в квартири та виходити з них, дроти (Труби) для переміщення інформації навколо та корисної для них в квартирах.

У вас також будуть такі місця, як басейн, тенісний корт, якими діляться всі мешканці будівлі. Тому їх можна розглядати як компоненти всередині SharedModule.

В основному різниця полягає в наступному,

Дотримуйтесь моїх слайдів, щоб зрозуміти будівельні блоки програми Angular

Ось моя сесія на тему Building Blocks of Angular for beginners

Найпростіше пояснення:

Модуль - це як великий контейнер, що містить один або багато маленьких контейнерів, які називаються компонент, служба, труба

Компонент містить:

• HTML-шаблон або HTML-код

• Код (TypeScript)

• Сервіс: Це код для багаторазового використання, який спільний для Компонентів, тому переписування коду не потрібно

• Труба: він приймає дані як вхідні та перетворює їх на потрібний вихід

.

Кутовий компонент

Компонент є одним з основних будівельних блоків програми Angular. У додатку може бути більше одного компонента. У звичайному додатку компонент містить файл класу сторінки перегляду HTML, файл класу, який керує поведінкою HTML-сторінки та CSS / scss-файл для стилювання перегляду HTML. Компонент можна створити за допомогою @Componentдекоратора, який є частиною @angular/coreмодуля.

import { Component } from '@angular/core';

і створити компонент

@Component({selector: 'greet', template: 'Hello {{name}}!'})
class Greet {
  name: string = 'World';
}

Для створення компонентного або кутового додатка ось підручник

Кутовий модуль

Кутовий модуль встановлений кутові основні будівельні блоки , таких як компонент , директиви , послуги і т.д. додаток може мати більше одного модуль.

Модуль можна створити за допомогою @NgModuleдекоратора.

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

Модуль у Angular 2 - це те, що складається з компонентів, директив, служб тощо. Один або багато модулів поєднуються для створення програми. Модуль розбиття програми на логічні фрагменти коду. Кожен модуль виконує одне завдання.

Компоненти в Angular 2 - це класи, де ви пишете свою логіку для сторінки, яку ви хочете відобразити. Компоненти контролюють перегляд (html). Компоненти спілкуються з іншими компонентами та службами.

Картина варта тисячі слів!

Концепція Angular дуже проста. У ньому пропонується "побудувати" додаток з "цеглинами" -> модулями.

Ця концепція дозволяє краще структурувати код і полегшити повторне використання та обмін.

Будьте обережні, щоб не плутати кутові модулі з модулями ES2015 / TypeScript.

Що стосується кутового модуля, він є механізмом для:

1- групи компонентів (але також послуги, директиви, труби тощо)

2- визначте їх залежності

3- визначити їх видимість.

Кутовий модуль просто визначається класом (зазвичай порожнім) та декоратором NgModule.

Компонент є the template(view) + a class (Typescript code) containing some logic for the view + metadata(to tell angular about from where to get data it needs to display the template).

Модулі, basically group the related components, services togetherщоб ви могли мати шматки функціональності, які потім можуть працювати незалежно. Наприклад, програма може мати модулі для функцій, для групування компонентів за певною функцією вашого додатка, наприклад, панелі інструментів, яку ви можете просто захопити та використовувати всередині іншої програми.