Введение в Angular 2 Шпаргалка
Angular 2 - это фреймворк с открытым исходным кодом, построенный на JavaScript. Он в основном использовался для разработки интерфейсных веб-приложений. Это наследник AngularJS. Это написано на TypeScript. Это разработано Google. Angular 2 построен на современном JavaScript, который использует ES6. Angular 2 обладает улучшенными возможностями обработки событий, мощными шаблонами, улучшенной поддержкой мобильных устройств и настольных веб-приложений. Он также совместим с мобильными устройствами и на всех платформах, таких как Windows, Mac и Linux.
Angular 2 имеет ключевые функции для разработки приложений, представляющих собой компоненты, набор текста и сервисы. Angular 2 имеет различные компоненты, такие как модули, компоненты, шаблоны, метаданные и сервис. Компоненты помогают встроить приложение во многие модули и помогают поддерживать приложение в течение более длительного времени. Различный набор кода поддерживался и использовался различными модулями приложения, заботящимися о сервисной функции. Модули помогают разбить приложение на логическую часть, которая закодирована для выполнения определенной задачи.
Команды и контент на Angular 2 Шпаргалка
Шпаргалка Angular 2 имеет обширную библиотеку, масштабируемую, расширяемую, интерактивную и содержит множество встроенных методов для вычисления общих операций. Существует другой синтаксис для шаблонов, NgModules, встроенных директив, форм и других конфигураций, доступных ниже:
| Синтаксис шаблона | ОПИСАНИЕ |
| Он связывает свойство 'value' с результатом выражения 'name' | |
| Он связывает атрибут «роль» с результатом выражения «моя роль» | |
| Он вызовет метод read Text, когда срабатывает событие click. | |
| Это связывает свойство с интерполированной строкой | |
|
Привет, мое имя)) | Это связывает контекст с интерполированной строкой |
| Он устанавливает двухстороннее связывание. | |
|
… | Символ * превращает текущий элемент во встроенный темп. |
|
Студент: ((student? .Sname)) | ? оператор навигации сообщает, что поле студента необязательно |
| Он связывает ширину свойства стиля для выражения результата mysize. | |
| Используется для привязки данных и выражения привязки событий в шаблоне. | |
|
Номер автомобиля: ((vehicleNumber | myCarNuFormat)) | Он преобразует текущее значение номера транспортного средства через канал mycarNuformat. |
| Это устраняет неоднозначность элемента из компонента HTML | |
| Это связывает присутствие класса на выражении правды. |
NgModules: - Различные директивы Ngmodule:
| Директивы | ОПИСАНИЕ |
| @NgModule ((заявления) ..) | Он определяет модуль, который содержит директивы и т. Д. |
| объявления: (MyRedComponent, MyBlueComponent, MyDatePipe) | Он покажет список компонентов, директив и каналов, принадлежащих этому модулю. |
| экспорт: (MyRedComponent, MyDatePipe) | Это будет список компонентов и труб, видимых для импорта этого модуля |
| импорт: (BrowserModule, SomeOtherModule) | Это будет список модулей для импорта в этот модуль |
| провайдеры: (MyService, (предоставить:…)) | Он предоставляет список поставщиков внедрения зависимостей, видимых как для содержимого модуля |
| entryComponents: (SomeComponent, OtherComponent) | Он предоставит список компонентов, на которые нет ссылок в достижимом шаблоне. |
Существуют и другие директивы, а также средства обнаружения изменений компонентов и ловушки жизненного цикла, которые могут быть реализованы в виде методов класса:
| Директивы | Описание |
| конструктор (myService: MyService, …) (…) | Он используется для внедрения зависимостей. |
| ngOnChanges (changeRecord) (…) | Он вызывается после каждого изменения входных свойств и перед обработкой содержимого или дочерних представлений. |
| ngOnInit () (…) | Вызывается после конструктора и инициализирующих свойств |
| ngDoCheck () (…) | Он вызывается каждый раз, когда проверяются свойства компонента или директивы. Используется для продления таможенной проверки. |
| ngAfterContentInit () (…) | Он вызывается после ngOninit, когда содержимое компонентов или директив было инициализировано. |
| ngAfterContentChecked () (…) | Он вызывается после каждой проверки содержимого компонента или директивы. |
| ngAfterViewInit () (…) | Он вызывается после ngaftercontentint, когда директивы представлений компонентов и дочерних представлений были инициализированы. |
| ngAfterViewChecked () (…) | Он вызывается после каждой проверки представлений компонентов и дочерних представлений, в которых указана директива. |
| ngOnDestroy () (…) | Он вызывается один раз, прежде чем уничтожить экземпляр. |
Бесплатные советы и рекомендации по использованию команд Angular 2 Cheat Sheet: -
- В шпаргалке Angular2 platformBrowserDynamic (). BootstrapModule (AppModule); помогает в начальной загрузке приложения, используя компонент root can из указанного.
- В Angular2 bootstrap: (MyAppComponent) перечислит компоненты для начальной загрузки, когда этот модуль загружается.
- это встроенная директива в angualr2 для удаления или воссоздания части дерева Dom на основе выражения.
- он превращает элемент списка и его содержимое в шаблон и используется для создания представления для каждого элемента в списке.
- «ConditionExpres sion»> эта директива используется для выбора шаблонов на основе значения выражения или в простых словах, таких как регистр переключателя в oops.
- эти директивы позволяют вам назначать стили элементу HTML с помощью CSS, и этот CSS может быть напрямую доступен.
- эта директива связывает CSS-классы элемента с доверенными значениями карты.
- эта директива обеспечивает двухстороннее связывание, анализ и проверку для элементов управления формой.
- селектор: '.cool-button: not (a)' это конфигурация директивы, которая определяет селектор CSS, который идентифицирует эту директиву в шаблоне. Он не поддерживает родительский дочерний селектор.
- pro viders: (MyService, (обеспечить:…)) предоставляет список поставщиков внедрения зависимостей для директивы и дочерних элементов.
- (предоставляет: MyService, useClass: MyMockService), это установит или переопределит поставщика для обслуживания к классу.
- (предоставьте: мое значение, используйте значение: 4) оно установит или переопределит значение провайдера на 4
Вывод - угловой 2 шпаргалка
Шпаргалка Angular 2 имеет множество функций и различных директив, для разработки доступны модули, которые помогают сделать приложение более интерактивным для пользователей и разработчиков для отслеживания проблем и функциональности. Это обширный и многоразовый для других приложений. Angular2 использует машинописный текст, который полностью отличается от более ранней версии AngularJS.
Угловую 2 шпаргалку легче освоить, поскольку ее кривая обучения проста и понятна как для начинающих, так и для студентов. Знание JavaScript будет преимуществом при использовании angular для разработки. Всегда хорошо убивать себя.
Рекомендуемые статьи
Это было руководство к Angular 2 Cheat Sheet, здесь мы обсудили содержание и команду, а также бесплатные советы и хитрости Angular 2 Cheat Sheet. Вы также можете посмотреть следующую статью, чтобы узнать больше -
- Шпаргалка UNIX
- Шпаргалка HTML
- Шпаргалка CCNA
- Шпаргалка JQuery