Що саме кутовий?

Angular - це фронтальна рамка з відкритим кодом JavaScript з відкритим кодом та створює реактивні додатки для однієї сторінки (SPA), і її створили розробники Google. Angular засвідчив широке розповсюдження контролю в Open Source JavaScript Frameworks, і це надзвичайно цінується між розробниками та підприємствами за свої чудові методи функціонування. Кутова інноваційна система MVW на стороні клієнта в даний час широко використовується для розробки мобільних додатків та веб-додатків. Він був написаний в Typescript із підтримкою стандартизації ES6 (ECMA Script 2015). Типовий скрипт, розроблений корпорацією Майкрософт, і він є набором JavaScript. Це перетворить код і перетворить у формат JavaScript або ES5. Typescript є сильно набраним і йому дозволяється писати такі функції OOPS, як оператори класу, інтерфейсу та модуля так само, як C # або Java, які прискорюють виконання та зменшують помилки часу виконання.

Далі наведені основні особливості кутового 2

  • Компоненти -

попередня версія Angular мала увагу контролерів, але тепер повністю змінила фокус на роботу з компонентами над контролерами. Компоненти допомагають створювати програми в декілька модулів. Це допомагає ефективніше керувати програмою протягом певного періоду часу.

  • Модуль -

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

Наприклад

  • Шаблон -

Шаблон - це ключова роль, яка виправдовує перегляд компонента. Можна було оголосити вигляд компонента, визначеного за допомогою шаблону. Він створений за допомогою HTML, включає прив’язку та директиву.

Наприклад

  • Метадані -

Це дуже корисно для підвищення ефективності занять. У Typescript для цього ідентифікується за допомогою класу декорування. Наприклад, щоб вказати будь-який компонент у програмі Angular, використовуйте метадані класу (наприклад, декоратор @Component).

Декоратор - це функція, яка ставить метадані до класу, це члени, або це аргументи методу.

  • Прив’язка даних -

Найефективнішою особливістю, Прив'язка даних, є з'єднувальний міст між Модель та Вид. Це робить автоматично синхронізованим. Кутова підтримка чотирьох типів прив’язки - прив'язка власності, прив'язка подій, інтерполяція та двостороння прив'язка.

  • Директива -

Директиви - це атрибути на замовлення HTML, що допомагають зберігати здатність HTML. Для створення директиви використовується @Directive декоратор для підключених метаданих класу. Три типи директив - Компонент, Декоратор та Шаблон.

  • Послуги -

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

  • Ін'єкційна залежність -

Ін'єкційна залежність в кутовій. Dependency Injection (DI) є базовим поняттям Angular 2+ і дозволяє класу збирати залежності від іншого класу. Зазвичай в кутовому режимі введення залежності виконується шляхом введення класу обслуговування в клас розділу або модуля.

Наприклад

Є багато текстового редактора, який повністю підтримує Typescript. Або з коробки, або з плагіном, включаючи все це, як зазначено нижче.

  1. Візуальна студія.
  2. Код візуальної студії.
  3. Атом.
  4. Затемнення.
  5. WebStorm.

Visual Studio Code - найкращий вибір, оскільки він є відкритим кодом і працює на Linux, Windows та MacOS. Він надає чудові функції, що підтримують Typescript, в тому числі

  • Автозаповнення
  • IntelliSense
  • Перевірка синтаксису
  • Рефакторинг

Щоб завантажити код Visual Studio, відвідайте веб-сайт за адресою https://code.visualstudio.com/download.

Крок до встановлення кутового 2

Тепер, Початок роботи з процесом встановлення Angular 2

Крок 1. Щоб встановити Angular 2, спочатку завантажте пакет node.js з веб-сайту https://nodejs.org/uk/download/.

Встановіть завантажене сховище npm (Node Package Manager) у вашу систему.

  • Якщо ви використовуєте систему Windows, встановіть інсталятор Windows.
  • Якщо ви використовуєте систему MacOS, встановіть інсталятор MacOS.

Перевірте сумісність вашої системи, наприклад 32-бітну або 64-бітну.

Крок 2: Встановлення вузла,

Тепер двічі клацніть на завантаженому файлі node-v10 15.3-x64.msi, щоб запустити інсталятор, і натисніть кнопку Далі на екрані інсталятора.

Крок 3: Тепер натисніть прапорець і прийміть умови Ліцензійної угоди . Потім натисніть кнопку Далі.

Крок 4: На наступному екрані, якщо потрібно, змініть шлях встановлення або натисніть кнопку Далі.

Крок 5: На екрані Наступний вибір функції збережіть вибір за замовчуванням та натисніть кнопку Далі.

Крок 6: Тепер для встановлення Node.js натисніть кнопку Встановити.

Крок 7: На наступному екрані почекайте завершення установки.

Крок 8: Тепер натисніть кнопку Готово.

Крок 9: Відкрийте командний рядок на вашій машині та введіть наступну команду та перевірте версію nodejs та версію npm:

c:/>node -v

c:/>npm -v.

Крок 10: Після встановлення завершено. Відвідайте сайт за адресою https://cli.angular.io/ для Angular CLI (інтерфейс командного рядка).

Крок 11: Відкрийте командний рядок на вашій машині та введіть команду “npm install –g @ angular / cli” та натисніть клавішу enter, щоб встановити Angular 2 CLI (Interface of Command Interface).

Примітка. Якщо ви використовуєте MacOS / Linux, просто поставте sudo перед npm, "sudo npm install - g @ angular / cli"

Крок 12: Введіть "ng new first-app" і натисніть клавішу Enter, щоб створити Перший додаток.

Крок 13: Коли ви встановите додаток Angular 2, вам буде запропоновано кілька запитань від Angular CLI.

  • Ви хочете додати кутову маршрутизацію? (Так / Ні) -> Ні
  • Який стандарт таблиці стилів хоче використовувати? (Використовуйте клавіші зі стрілками) -> CSS

Крок 14: У першому додатку додайте всі пакунки за допомогою кутового CLI

Після встановлення всіх пакетів це означає, що додаток створюється на диску.

Крок 15: Введіть у командному рядку команду “ng –version” та натисніть клавішу Enter, щоб дізнатись кутову версію

Крок 16: Тепер введіть команду "cd first-app", щоб потрапити в каталог або папку додатків.

Крок 17: Нарешті, створено кутовий додаток "Перший додаток"; тепер введіть команду “ng serve”.

Крок 18: Відкрийте браузер і введіть http: // localhost: 4200 в адресному рядку та натисніть клавішу Enter, щоб запустити в браузері додаток First Application Angular.

Рекомендовані статті

Це керівництво по установці кутових 2. Тут ми обговорили основні особливості Angular 2 та кроки для установки Angular 2. Ви також можете переглянути наступні статті, щоб дізнатися більше -

  1. Кутова 2 шпаргалка
  2. Кутові 2 питання для інтерв'ю
  3. Кутовий 2 проти Vue JS
  4. Кутові команди