Mi AngularJS?
AngularJS van egy erős és strukturális JavaScript keretrendszer amely könnyebb megvalósítani az egységes webes alkalmazások, és lehetővé teszi a nagy szervező, ügyfél nehéz alkalmazások valami kezelhető. Ez egy nyílt forráskódú webes alkalmazás keretrendszer, szabad és ezrei használják a világ fejlesztői.
AngularJS alapul MVC (Model View Control) minta, amely célja, hogy a gazdag internetes alkalmazások és webes leegyszerűsíti mind a fejlesztés és a tesztelés alkalmazások segítségével MVC architektúra és szétválasztja gazdag internetes alkalmazásokat modellek, nézetek és vezérlők. AngularJS létre egy oldalt alkalmazások, ami azt jelenti, a böngésző fog betölteni egy oldalt, függetlenül attól, hogy mekkora a kérelem.
AngularJS által kifejlesztett Miskohevery és Adam Abron,által fenntartott Google; használják belsőleg, és MIT. Licence van az Apache License 2.0. Ez eredetileg megjelent 2009 és a jelenlegi stabil kiadás 1.3.5 (Decemeber 1, 2014).
AngularJS: Ebben a részben, foglaljuk össze az alapokat a AngularJS.
- Van egy könyvtár írt JavaScript
- Nem egy platform vagy nyelv
- Nem egy plug-in, vagy kiterjesztés
- Ez kiterjeszti a HTML, CSS és JavaScript
- Nem egy DOM manipuláció könyvtár mint jQuery
- Nem igényel jQuery vagy öröklési
- Nem igényel egyirányú adat kötelező és boilerplate kód
Miért AngularJS?
- Ez alapján MVC tervezési mintát, amely számos módon építeni internetes alkalmazás kliens oldali.
- Ez segít, hogy a kliens oldali alkalmazásokat kevesebb kód és nagyobb rugalmasságot.
- Ez kiterjeszti a HTML használatával funkcionalitása irányelvek, attribútumok, kifejezések és sablonok HTML.
- AngularJS egy MVC architektúra, amely leegyszerűsíti a fejlesztés és a tesztelés alkalmazások könnyen kliens oldali.
- Ez jó a fejlődő egylapos alkalmazások és kezelőfelületekről webalapú alkalmazásokhoz.
- Ez a rugalmas keret és sokoldalú funkciók. Ezért használják mind a nagy app projektek és kis apró alkalmazások.
Features:
AngularJS (JavaScript keretrendszer) teremt alkalmazások gyorsabb módon használatával számos funkciót, mint például:
- Ez egy kliens oldali technológia, amely nagy dolgokat, hogy dinamikus webes alkalmazásokat.
- Ez egy MVC keretrendszer, lehetővé teszi a felhasználók, hogy megfelelő építészeti és karbantartható webes alkalmazások.
- Ez egy nyílt forráskódú webes alkalmazás keretrendszer ezrei használják a világ fejlesztői.
- Ez lehetővé teszi, hogy újrahasználható alkatrészek és a kód újrafelhasználásának.
- Ez teszi létrehozása felhasználói felület (UI) könnyen át adatokat kötelező folyamat.
- A deklaratív HTML megközelítés.
- Segít osztani az alkalmazás kisebb részekre.
Építészeti rajz és alkatrészek: Vessünk egy pillantást az architektúra diagram a AngularJS keret és annak összetevői.
Figure: AngularJS Architecture
AngularJS tartalmaz modulok ami jár, mint a tartály különböző típusú alkalmazások, mint például vezérlők, nézetek, irányelvek, gyár stb. Modul meghatározza, hogyan kell kérelmet kell bootstrap. modulok használata, folyamatok könnyebb lesz megérteni; akkor újra a kódot, végéig vizsgálatokat használ modulokat, hogy felülbírálja a konfiguráció, stb. Ez az a hely létrehozására, regisztráció és visszakeresésére szögletes modulok.
config komponens csak akkor fogadja el a szolgáltatók modulok, jelenti, hogy minden szolgáltatás, gyár stb olyan esetek szolgáltató. Ez biztosítja az összes ilyen esetekben az útvonalak.
A útvonalak használt összekötő URL szabályozóknak és nézetek.
A Nézetek használnak hozzá kifinomult kezelése felhasználói események. ez használ ng-nézetirányelv, amely kiegészíti az útvonalat szolgáltatás sablon az aktuális útvonal a fő elrendezés (index.html) fájl.
A ellenőr vezérli az adatok AngularJS alkalmazások, amelyek rendszeresen JavaScript objektumok. AngularJS határozza ng-vezérlőirányelvet, amely megteremti az új vezérlő objektumokat vezérlő funkció. És az új gyerek áll a vezérlő funkciót $hatályaahogy az ábrán látható.
A nézetek küld eleme vagy attribútuma, hogy a irányelvek amely azt mondja AngularJS HTML fordító csatolni meghatározott magatartást a DOM elem és gyerekek.
A gyár meghatározására használják a AngularJS szolgáltatást, és az úgynevezett amikor egy szolgáltatást kell példányosítható.
Az első lépések AngularJS:
AngularJS könnyű kezdeni. Ez biztosítja funkciók, mint a kétirányú adatok kötelező amely egyedi címkék, jellemzőket felölelik beépített irányelvek, amelyek kiterjesztése funkcionalitását HTML könnyebb.
- Ez oszlik JavaScript fájlt, és fel lehet használni a weboldal által beleértve AngularJS könyvtár az alábbi módon:
[kód]
<script src =”http:// ajax.googleapis.com/ajax/libs/ angularjs /1.2.26/ angular.min.js”>
</forgatókönyv>
[/kód]
Azt is ellenőrizze a legfrissebb verzióját AngularJS a saját hivatalos honlapján.
- Hozhat létre AngularJS alkalmazás az alábbi módon:
[kód]
<htmlng-app></html>
Vagy
<html ng-app = "MyApp"></html>
Vagy
<divng-app></div>
Vagy
<div ng-app = "MyApp"></div>
[/kód]
A ng-app attribútum a gyökér eleme a AngularJS app.
- Controller lehet meghatározni, mint alább látható:
[kód]
<div ng-app = "" ng-szabályzó = "MyController">
<input type = "text" ng-modell = "üzenet">
</div>
[/kód]
A ng-vezérlőirányelv meghatározza az alkalmazás vezérlő. A ng-modellirányelv kötelezi az értékét HTML ellenőrzéseket, mint beviteli mezők, válassza ki, stb, hogy az alkalmazási adatok.
- Végrehajtja a kontroller segítségével $hatálya objektum, mint írva az alábbiakban:
[kód]
functionMyController($hatálya){
$scope.message = "Adja meg a nevét";
}
[/kód]
A $hatálya objektum hivatkozik a modell, amely meghívja a vezérlő, amely létrehozza üzenet ingatlan a hatálya alá.
Core Concepts:Ebben a részben lesz egy részletes vitát az alapvető összetevők és a fogalmak mögött.
- modulok
- irányelvek
- Alkalmazási kör
- vezérlők
- kifejezések
- sablonok
- routing
- szűrők
modulok:
A modulok kiváló mechanizmust elosztjuk az alkalmazás kis újrafelhasználható komponensek és meghatározza, hogy egy alkalmazás kell bootstrap. A modulok adja, hogyan határozza meg a komponensek az alkalmazás, és teszi alkalmazása olvashatóbb. Minden modul azonosít egy egyedi nevet.
irányelvek:
Irányelvek alapvető építőkövei AngularJS, amelyek segítségével létre egyedi címkék és lehet helyezni elemneveket, attribútumok és megjegyzések. Irányelvek lehet használni, mint a HTML irányelvek építeni összetett widgetek rakott funkcionalitás.
Alkalmazási kör:
Scope egy objektum, amely kötődik a céllal, hogy a vezérlő. In MVC szerkezet, arra utal, hogy az alkalmazás modell. Scope nézheti kifejezéseket és szaporodni események vannak elrendezve hierarchikus.
vezérlők:
Vezérlők JavaScript objektumok, amely meghatározza a tényleges viselkedése az alkalmazás. Ez felelős a beállítás modell tulajdonságai és funkciói segítségével $hatálya tárgy. A vezérlő nem tárolja az állami és nem lép kölcsönhatásba a távoli szolgáltatások.
kifejezések:
Kifejezések vannak írva benne kapcsos zárójelek "{{ }}"Jelöli kötések, amelyek hivatkozók a mi alkalmazás modell. Kifejezések nem támogatják ellenőrzési flow kimutatások. AngularJS fogja kiírni az adatokat, amennyiben azok használják.
sablonok:
Sablon csak régi sima HTML, amely nem tartalmaz semmilyen konkrét szögletes fájlsablonokat. Jön egy sor éles sablonok létrehozása vezérlők stb segítségével sablon motor. A sablonok megjeleníteni az adatokat a modell és a vezérlő.
routing:
Ezt alkalmazzák összekötő URL a vezérlőhöz és nézetek. Routing elintézve a szolgáltatók által hívott $útvonal üzemeltető kezelni routing, amely a szolgáltató a $útvonal szolgáltatás. Más szavakkal, ez terhelés alatti sablonok függően az oldal URL.
szűrők:
Szűrők használhatók kifejezéseket transzformálására vagy módosítsa az adatokat a modellek. Mi adhat kifejezéseket vagy irányelveket a cső karakter. AngularJS van néhány, a leggyakrabban használt szűrők, mint például:
- valuta: alakítja számot pénznem formátum.
- nagybetűs: konvertálja húrok nagybetűs.
- kisbetűs: konvertálja húrok kisbetűs.
- szűrő: kiválasztja részhalmaza elemeket tömb.
- orderBy: megbízások tömb kifejezéssel, mint ábécésorrendben vonósokra és numerikusan számok.
Példa:
Hozzunk létre egy egyszerű példát a AngularJS könyvtár, és hozzon létre egy HTML fájlt FirstExample.html az alábbiakban bemutatott:
Listing1: Egyszerű AngularJS alkalmazás
[kód]
<!DOCTYPE html>
<html>
<fej>
<script src = “http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js”></forgatókönyv>
</fej>
<test>
<div ng-app =”” ng-szabályzó =”MyController”>
Név megadása: <input type =”text” ng-modell =”felhasználónév”><br>
<br>
Teljes név: {{felhasználónév}}
</div>
<forgatókönyv>
functionMyController($hatálya) {
$scope.userName = “David”;
}
</forgatókönyv>
</test>
</html>
[/kód]
Ahogy megbeszéltük, van benne AngularJS JavaScript fájlt a HTML oldalt, amely belül meghatározott <fej> tag. A következő rész tartalmaz AngularJS alkalmazás, amely meghatározása a ng-app attribútum belül fut a <div> tag.
A ng-vezérlő irányelv meghatározza az alkalmazás vezérlő. A AngularJS fogja idézni "MyController” val vel $hatálya tárgy, amely megteremti tulajdon úgynevezett "felhasználónév” az irányelv hatálya alá.
Határozza meg a modell nevét használja ng-modellirányelv meghatározott <bemenet> tag. Megköti a beviteli mezőbe a vezérlő tulajdonság "felhasználónév”.
Nyissa meg a FirstExample.html A böngésző és nézze meg az eredményt, ahogy az alábbi képernyőkép:
Figure: AngularJS példa
Következtetés: Már tárgyalt valamennyi aspektusát AnguarJS. Mielőtt kötni, foglaljuk össze a pontokat. AngularJS (néven is ismert szögletes)egy nyílt forráskódú webes alkalmazás keretrendszer. Ez biztosítja a kliens oldali MVC architektúra együtt általánosan használt alkatrészek szükséges gazdag internetes alkalmazások. AngularJS következik deklaratív programozási modellt kínál a felhasználói felületek. A fő cél ennek a keret, hogy a fejlesztési és tesztelési könnyebb.
Remélem már megvan a világos megértése a AngularJS keret. Élvezze olvasás www.techalpine.com