AngularJS (հայտնի է նաև Angular և Angular.js անուններով), բաց կոդով JavaScript framework է կառուցված MVC ճարտարապետության վրա, որը հիմնականում հովանավորվում է Գուգլ-ի կողմից։ AngularJs-ը ստեղծված է մեկէջյա Վեբ համակարգեր ստեղծելու համար։ Այն ձևափոխում է HTML-ն հավելյալ HTML tag-երի և HTML tag-երի ատրիբուտների միջոցով։ HTML tag-երի ատրիբուտների միջոցով հիմնականում արտացոլվում են կամ արժեքներ են ստանում JavaScript փոփոխականները։
 | |
|---|---|
| Տեսակ | ֆրեյմվորք, ՋավաՍկրիպտ գրադարան և ծրագրային գրադարան |
| Նախագծումը՝ | Գուգլ |
| Գրված է՝ | ՋավաՍկրիպտ[1] |
| Լույս տեսավ՝ | հոկտեմբերի 20, 2010 |
| Պլատֆորմ | web platform? |
| Վերջին կայուն տարբերակ | 1.8.3 (ապրիլի 7, 2022)[2][3] |
| Արտոնագիր | MIT արտոնագիր[4][5] |
| Կայք | angularjs.org(անգլ.) |
| Ելակոդ | github.com/angular/angular.js |
| AngularJS Վիքիպահեստում | |
AngularJs-ը նաև կիրառվում է IONIC framework-ում, օգտագործելով Apache Cordova-ն, հիբրիդային բջջային հավելվածներ ստեղծելու համար։
AngularJs-ը նաև հանդես է գալիս MEAN-ի frontend-ը, որը MongoDB, Express.js, AngularJs և Node.js տեխնոլոգիաների համագործակությունն է։
Նկարագրություն
Մեթոդներ, որոնք նախանշված են $ http ծառայությունների համար՝
* delete() * get() * head() * jsonp() * patch() * post() * put()
Հատկություններ
- config– գեներացնում է հարցման ենթակա օբյեկտը
- data a string– սերվերից ստացվող պատասխանը կրող տող կամ էլեմենտ։
- headers– Վերնագրի մասին տեղեկություն հաղորդող ֆունկցիա։
- status –կարգավիճակի նույնականացման համարը ։
- statusText– HTTP կարգավիճակը որոշող տող։
Ներկառուցված AngularJS կիրառական հրահանգներ
AngularJS դիրեկտորիայի միջոցով հնարավոր է ստեղծել ծրագրավորման HTML-թեգեր և ատրիբուտներ, որպեսզի որոշ տարրերի հատկություններ վերագրվեն[6]։
- ng-app
- Ընտրում է օբյեկտ և հայտարարում է որպես արմատ` դիմումի համար.[7]
- ng-bind
- ՀՏՄԼ կոդը փոխարինում է այն օբյեկտով, որն անմիջապես ստանում է փոխարկված արժեքը։
- ng-model
- Նման է ng-bind-ին, միայն ապահովում է երկկողմանի կապը[8]։ Փոփոխելով օբյեկտի պարունակությունը, անգուլյարը փոխում է նաև մոդելի նշանակությունը։ Մոդելի իմաստը փոխվելով՝ փոխվում է օբյեկտի ներքին պարունակությունը։
- ng-class
- Դինամիկ դասերի համար սահմանում է ներբեռնումներ։
- ng-controller
- HTML արտահայտությունների համար սահմանում է Javascript- ի վերահսկիչ, որը կհամապատասխանի MVC- ին[9]։
- ng-repeat
- Յուրաքանչյուր հավաքածուի համար սահմնաում է DOM- ի օրինակ[10]։
- ng-show և ng-hide
- Թաքցնում կամ ցուցադրում է օբյեկտը՝ կախված արտահայտության իմաստից։
- ng-switch
Տարբեր հնարավոր տարբերակներից ստեղծում է շաբլոնի մոդել, որը կհամապատասխանի արտահայտության արժեքին։
- ng-view
- Բազային դիրեկտորիա, որը պատասխանատու է երթուղու մշակման համար[11], որոնք ընդունում են JSON- ն, նախքան տվյալ կարգավարների կողմից վերահսկվող կաղապարներ ցուցադրելը։
- ng-if
- Ավելացնում կամ հեռացնում են DOM- դոմենի մի մասը, կախված արտահայտության արժեքից։
Եթե ngIf- ին տրված արտահայտության արժեքը կեղծ է, ապա տարրը հեռացվում է DOM- ից, հակառակ դեպքում կլոնավորված տարրը նորից տեղադրվում է DOM- ում[12]։ Կան նաև դիրեկտիվներ, որոնք օգտագործում են շաբլոններ script թեգերում[13][14]։
Ստեղծման նպատակները
- առանձնացնել DOM-ի հետ աշխատանքը ծրագրի բիզնես տրամաբանությունից
- առանձնացնել frontend-ը backend-ից
- տրամադրել կառուցվածք, որում հստակ առանձնացված են օգտագործողի ինտերֆեյս (անգլ.՝ UI) մշակողի, բիզնես տրամաբանությունը գրողի և տեսավորողի աշխատանքները
Տվյալների երկկողմանի կապ
Տվյալների երկկողմանի կապը AngularJS -ում ամենակարևոր առանձնահատկությունն է, որը կրճատում է ծրագրային կոդերի քանակը՝ սերվերին ազատելով շաբլոնների հետ աշխատանքի անհրաժեշտությունից։ Դրա փոխարեն շաբլոնները դիտարկվում են որպես առանձին սովորական HTML, որը լրացված է մոդելում հատկանշված տվյալներով։ $scope ծառայությունը Angular-ում վերահսկում է մոդելի փոփոխությունները վերահսկիչի միջոցով։ Բացի դրանից, յուրաքանչյուր փոփոխությունն արտացոլվում է մոդելում։ Սա թույլատրում է անհրաժեշտության դեպքում շրջանցել DOM-ը և վեբ-ծրագրերում հեշտացնում է սկզբնավորումն ու նախատիպերի սահմանումը[15]։
Բերենք օրինակ, որտեղ դիմում է հղվում սերվերին.
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $http) {
$http.get("welcome.htm")
.then(function(response) {
$scope.myWelcome = response.data;
});
});
Պատասխանն արտածվում է՝ Today's welcome message is:
Hello AngularJS Students
The $http service requests a page on the server, and the response is set as the value of the "myWelcome" variable.
Plugin Chrome-ի համար
2012 թ. հուլիսին Անգուլար թիմը Google Chrome զննարկիչի համար թողարկեց Batarang անվանումով պլագին[16], որը հեշտացնում է այն վեբ-էջերի կարգավորումները, որոնք ստեղծված են Angular խմբագրիչով։ Ընդլայնումը թույլ է տալիս հեշտությամբ հայտնաբերել խոչընդոտները և կարգաբերող ծրագրերի համար առաջարկում է գրաֆիկական ինտերֆեյս[17]։
Ծանոթագրություններ
Wikiwand - on
Seamless Wikipedia browsing. On steroids.