Введение в Angular JS Application

Angular JS - это приложение с открытым исходным кодом. Это было написано на JavaScript. Angular JS был разработан в 2010 году компанией Google. Приложение Angular JS также предоставляет динамическую ссылку на веб-приложения и страницы. Angular JS позволяет расширить словарный запас HTML для вашего приложения. Angular JS используется потому, что HTML не работает, когда его пытаются использовать для объявления динамических представлений в веб-приложениях. Angular JS называется набором инструментов для создания Framework, наиболее подходящим для разработки ваших приложений.

Возможности Angular JS Framework могут быть изменены или заменены, использованы повторно, чтобы соответствовать или более уникально для рабочего процесса и для дальнейшего использования. Он полностью расширяем и работает с другими библиотеками. Код приложения AngularJS прост в старых объектах JavaScript. Это делает ваш код для тестирования, обслуживания, повторного использования. В угловых JS нет необходимости наследовать от проприетарных типов, чтобы обернуть модели в методы доступа, как мы это делаем в других. Angular JS следовал новейшим концепциям развития.

Концепции Angular JS Application

Концепции Angular JS Application с их примерами заключаются в следующем:

  • Директивы для расширения атрибутов HTML

Директива функции является уникальной и доступна в других средах. Директивы написаны легко и могут быть общими, так как они могут быть написаны один раз и многократно использоваться повторно. Директивы действительно полезны, и есть много причин для их использования, например, когда у вас есть особые потребности в виде пользовательской сетки или другой функциональности, директива, которую вы хотите, на самом деле еще не существует. Директива Angular JS Application начинается с 'ng-', например ng-pp, ng-controller, ng-view, ng-model, ng-class, ng-click, ng-src и т. Д.

Пример:




Цикл с ng-repeat:

    (( Икс ))
  • Сфера

Он используется для связи между контроллером и представлением. Он связывает представление с моделью представления и функциями, определенными в контроллере. Angular JS Application поддерживает вложенные или иерархические области действия. Это источник данных для Angular JS Application, который может добавлять или удалять свойства при необходимости. Все манипуляции с данными и присвоение данных происходит через объект видимости, когда выполнять операцию CRUD.

  • Контроллеры

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

Пример:




First Name:

Last Name:


Full Name: ((firstName + " " + lastName))

var app = angular.module('myApp', ());
app.controller('myCtrl', function ($scope) (
$scope.firstName = "James";
$scope.lastName = "Anderson";
));

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

Он синхронизирует данные между моделью и представлением. Это означает, что изменение в модели обновит представление. Директива ng-model используется для двустороннего связывания данных.

Пример:
Когда пользователь вводит текстовое поле, измененное значение отображается в верхнем и нижнем регистре в метке, которая является двусторонней привязкой данных.

  • Сервисы

Он используется, когда состояние совместно используется приложением и требуется решение для хранения данных. Он может быть одноэлементным и может использоваться другими компонентами, такими как директивы, контроллеры и другие службы. Используются следующие сервисы: $ http, $ location, $ log, $ route, $ filter, $ document, $ timeout, $ exceptionHandler.

  • Маршрутизация

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

Пример: маршрут по умолчанию

App.config(('$routeProvider',
function($routeProvider)
(
$routeProvider.
when('/List',
(
templateUrl: 'Views/list.html',
controller: 'ListController'
)).
when('/Add',
(
templateUrl: 'Views/add.html',
controller: 'AddController'
).
otherwise((
redirectTo: '/List'
));
)));

  • фильтры

Они используются для расширения поведения выражения привязки и директивы. Это позволяет форматировать данные и форматировать значения или применять определенные условия. Фильтры вызываются в HTML с помощью конвейера внутри выражений.

Пример:

< html>

var app = angular.module('myApp', ());
app.controller("namesCtrl", function ($scope) (
$scope.friends = (
( name: "Karl", age: 27, city: "Bangalore" ),
( name: "Lewis", age: 55, city: "Newyork" ),
);
));

html>

var app = angular.module('myApp', ());
app.controller("namesCtrl", function ($scope) (
$scope.friends = (
( name: "Karl", age: 27, city: "Bangalore" ),
( name: "Lewis", age: 55, city: "Newyork" ),
);
));

Фильтрация ввода:

    (((x.name | прописные буквы) + ', ' + x.age + ', ' + x.city))
  • Выражения

Выражения (()) являются декларативным способом указания местоположения привязки данных в HTML и использования выражения для привязки данных. Он может быть добавлен в шаблоны HTML и не поддерживает операторы потока управления, но поддерживает фильтры для форматирования данных перед их отображением.

Пример:




Введите что-то в поле ввода:

Имя:

Вы написали: ((firstName))

  • Модули

    Модуль является контейнером приложения, а контроллеры приложений принадлежат этому модулю. Это набор функций, который делит приложение на небольшой и многократно используемый функциональный компонент. Модуль может быть идентифицирован уникальным именем и может зависеть от других модулей.

Пример:



//Referring module name myApp
(( firstName + " " + lastName ))


  • тестирование

Для тестирования кода приложения Angular JS широко используются тестовые среды, такие как Jasmine и karma. Эти среды тестирования в основном поддерживают моделирование и легко настраиваются с помощью файла JSON с помощью различных подключаемых модулей Angular JS Application.

Вывод - угловое приложение JS

Angular JS предоставляет структуру, которая имеет уникальные директивы и мощные функции. Директивы помогают нам в создании нового синтаксиса HTML, который в основном специфичен для приложения. Он используется в качестве компонентов многократного использования. Компонент позволяет скрыть сложную структуру и другое поведение. Акцент будет сделан только на том, что приложение делает и как приложение выглядит отдельно. В настоящее время приложение Angular JS становится популярным среди пользователей, поскольку его легко изучить и разработать. На рынке есть много возможностей для разработчика переднего плана. Если вы хорошо разбираетесь в JavaScript, то Angular JS не будет сложным для вас, и вам будет полезно обновить свои навыки с помощью этой технологии.

Рекомендуемые статьи

Эта статья была руководством по Angular JS Application. Здесь мы обсудили концепции Angular JS Application с некоторыми примерами, чтобы лучше понять. Вы также можете посмотреть следующую статью, чтобы узнать больше.

  1. Отличия угловых 5 и угловых 4
  2. Что такое машинное обучение?
  3. Различия между JSON и BSON
  4. Что такое Laravel Framework?
  5. Что такое тестирование фреймворков для Java?