Këndore me pak fjalë

Angular JS është bërë një nga kornizat më të mira të JavaScript në ueb dhe pasi të punosh me të, është e lehtë të kuptosh pse. Angular trajton automatikisht lidhjen e të dhënave në mënyrë që i gjithë aplikacioni të mbetet dinamik dhe i përditësuar. Por përsëri ky efekt mund të arrihet me korniza të tjera si Knockout, Ember ose Backbone. Pra, çfarë e bën Angular të dallohet nga të tjerët. E menduat… (rulni daulle ju lutem) Direktiva!!

Angular bazohet kryesisht në aftësinë e tij për të përdorur direktiva për të shtuar të gjithë funksionalitetin e tij kryesor në një faqe. Atëherë, çfarë është një direktivë? Duke dalë mirë nga "faqja e internetit Angular", direktivat përshkruhen si:

At a high level, directives are markers on a DOM element (such as an attribute, element name, comment or CSS class) that tell AngularJS’s HTML compiler ($compile) to attach a specified behavior to that DOM element (e.g. via event listeners), or even to transform the DOM element and its children.

Me fjalë të thjeshta, kjo thotë se një direktivë është një shënues në DOM (modeli i objektit të dokumentit) që mund të shtojë sjellje specifike ose të transformojë elementin në diçka tjetër kur faqja përpilohet ose jepet në shfletues. Nuk e di për ju, por kjo tingëllon sikur direktivat janë Transformers of Angular.

Llojet e direktivave

Më herët përmenda se direktivat janë një pjesë e madhe e Angular, por si? Për të filluar, ndoshta duhet të kuptojmë se si të përdorim direktivat. Ka 4 mënyra për të thirrur një direktivë nga DOM:

Elementi

<my-directive></my-directive>

atribut

<div my-directive="{{data}}"></div>

Klasa

<div class=”my-directive: {{data}}”></div>

Komentoni

<!-- my-directive: data -->

Më së shpeshti do të shihni direktivat në Angular të përdorura si elemente ose atribute. "Angular" madje përmend se është praktikë e keqe të përdoren direktivat si klasa ose komente pasi ato metoda janë kufizuese në funksionalitetin e tyre të mundshëm ose qëllimin e qartë.

Praktika më e mirë: Preferoni përdorimin e direktivave nëpërmjet emrit të etiketës dhe atributeve në vend të emrave të komenteve dhe klasave. Bërja e kësaj në përgjithësi e bën më të lehtë përcaktimin e direktivave që përputhet një element i caktuar.

Direktivat e integruara të Angular

Angular vjen i ndërtuar me shumë direktiva të paracaktuara që shtojnë një ton fuqi në mënyrën se si mund ta përdorim Angular në aplikacionet tona. Disa nga direktivat kryesore të atributeve me të cilat vjen angular përfshijnë: ng-app, ng-kontroller, ng-view, ng-cloak, ng-bind dhe ng-repeat. Disa nga direktivat e elementeve që përdor Angular përfshijnë: a, skriptin, formën, zonën e tekstit dhe hyrjen. Një listë e plotë e direktivave të integruara mund të gjendet këtu.

Kur fillova ndërtimin e Angular, ishte e lehtë të shihja direktivat e atributeve dhe se si ato përdoreshin. Për shembull, ng-app përdoret për të përcaktuar modulin që përfshin përmbajtjen brenda fushës së tij. Në mënyrë të ngjashme ng-kontrolluesi arrin të njëjtin rezultat si ng-app vetëm posaçërisht për kontrollorët. Por elementët e integruar ishin pak më të vështirë për t'u gjetur (pa kërkuar vetëm ato).

Pra, tani që ne e dimë se çfarë janë Direktivat Angular dhe si përdoren ato, çfarë është më pas? Unë do t'ju inkurajoja të kapni IDE-në tuaj të preferuar ose një mjet në internet si Plunkr ose JSFiddle dhe të luani me direktivat dhe të shihni se si mund të përfitoni prej tyre. Ose mund të qëndroni të sintonizuar për postimin tim të ardhshëm ku unë shkoj në detaje se si mund të fillojmë të përdorim direktivat e integruara të Angular për të marrë kontrollin e aplikacioneve tona. Deri atëherë, "Direktivat transformohen dhe shfaqen!"