Въведение в ъглово приложение JS

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

Ъгловите функции на JS рамката могат да бъдат модифицирани или заменени, използвани повторно, за да отговарят на повече или уникални за работния процес и за бъдеща справка. Той е напълно разширим и работи и с други библиотеки. AngularJS Кодът на приложение е обикновен в стари JavaScript обекти. Той прави вашия код да тества, поддържа, използва повторно. В ъглови JS не е необходимо да се наследяват от собствени типове, за да се обвиват моделите в методи на аксесоари, каквито трябва да правим в други. Angular JS е последвал най-новите концепции за развитие.

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

Концепциите на Angular JS Application с техните примери са следните:

  • Директиви за разширяване на HTML атрибути

Директивата за функции е уникална и се предлага в други рамки. Директивите се пишат лесно и могат да бъдат и общи, тъй като могат да бъдат написани веднъж и многократно използвани. Директивите са наистина полезни и има много причини да се използват, например когато имате специални нужди като персонализирана мрежа или друга функционалност, директивата, която искате, наистина все още не съществува. Ъгловата директива за приложение JS започва с 'ng-' като ng-pp, ng-контролер, ng-view, ng-model, ng-class, ng-click, ng-src и т.н.

Пример:




Looping с ng-повторение:

    (( х ))
  • Обхват

Използва се за комуникация между контролер и изглед. Той свързва изглед към модела на изглед и функциите, дефинирани в контролера 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-модел се използва за двупосочно свързване на данни.

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

  • Услуги

Използва се, когато държавата е споделена в приложението и се нуждаете от решение за съхранение на данни. Тя може да бъде сингъл и може да се използва от други компоненти като директиви, контролери и други услуги. Използваните услуги са $ http, $ location, $ log, $ route, $ filter, $ document, $ timeout, $ изключениеHandler.

  • Прекарването

Той помага при разделянето на приложението на множество изгледи и обвързването на множество изгледи към контролерите. Той разделя 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 Application Code широко се използват тестови рамки като Жасмин и карма. Тези тестови рамки основно поддържат подигравателни и силно конфигурируеми с помощта на 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?