Úvod do aplikácie Angular JS

Angular JS je aplikácia s otvoreným zdrojovým kódom. Bolo napísané v jazyku JavaScript. Angular JS bol vyvinutý v roku 2010 spoločnosťou Google. Aplikácia Angular JS poskytuje dynamický odkaz aj na webové aplikácie a stránky. Angular JS vám umožní rozšíriť slovník HTML pre vašu aplikáciu. Uhlový JS sa používa, pretože HTML sa pri pokusoch o použitie na deklarovanie dynamických zobrazení vo webových aplikáciách obmedzuje. Úhlový JS sa označuje ako sada nástrojov na vytváranie rámca, ktorá najviac vyhovuje vášmu vývoju aplikácií.

Úhlové prvky rámca JS možno modifikovať alebo nahradiť, znovu použiť, aby vyhovovali viac alebo jedinečným pracovným postupom a pre budúce použitie. Je plne rozšíriteľná a spolupracuje aj s inými knižnicami. AngularJS Aplikačný kód je jednoduchý v starých objektoch javascript. Vďaka tomu bude váš kód testovať, udržiavať a opakovane používať. V uhlovom JS nie je potrebné zdediť proprietárne typy, aby sa modely zabalili do prístupových metód, aké musíme robiť v iných. Angular JS sledoval najnovšie koncepcie vývoja.

Koncepty aplikácie uhlového JS

Koncepty aplikácie Angular JS a ich príklady sú nasledujúce:

  • Smernice na rozšírenie atribútov HTML

Smernica o vlastnostiach je jedinečná a dostupná v iných rámcoch. Smernice sa píšu ľahko a môžu byť aj všeobecné, pretože sa môžu písať raz a opakovane sa opakovane používajú. Smernice sú naozaj užitočné a existuje veľa dôvodov, prečo ich používať, napríklad ak máte špeciálne potreby ako vlastnú mriežku alebo inú funkčnosť, smernica, ktorú chcete, ešte neexistuje. Smernica o aplikácii Angular JS sa začína „ng-“, ako je ng-pp, ng-controller, ng-view, ng-model, ng-class, ng-click, ng-src atď.

Príklad:

Opakovanie s opakovaním ng:

    (( X ))

  • Rozsah

Používa sa na komunikáciu medzi kontrolérom a zobrazením. Väzuje pohľad na model pohľadu a funkcie definované v ovládači Angular JS Application podporuje vnorené alebo hierarchické rozsahy. Je to zdroj údajov pre Angular JS Application a podľa potreby môže pridať alebo odstrániť vlastnosť. Všetka manipulácia s údajmi a ich priradenie sa deje prostredníctvom objektu predmetu, keď sa má vykonať operácia CRUD.

  • radiče

Tieto sa používajú na definovanie rozsahu pohľadov a rozsah sa dá považovať za premenné a funkcie, ktoré pohľady môžu používať určité väzby.

Príklad:




First Name:

Last Name:


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

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

  • Viazanie údajov

Synchronizuje údaje medzi modelom a zobrazením. To znamená, že zmena modelu aktualizuje zobrazenie. Smernica ng-model sa používa na väzbu obojsmerných údajov.

Príklad:
Keď používateľ zadá do textového poľa zmenenú hodnotu, zobrazí sa v menovke, ktorá je obojsmerná väzba údajov, veľké a malé písmená.

  • služby

Používa sa, keď je stav zdieľaný v celej aplikácii a vyžaduje riešenie na ukladanie údajov. Môže to byť singleton a môžu ho používať ďalšie komponenty, ako sú smernice, kontroléry a ďalšie služby. Používané služby sú $ http, $ location, $ log, $ route, $ filter, $ document, $ timeout, $ exceptionHandler.

  • smerovanie

Pomáha pri rozdelení aplikácie do viacerých zobrazení a viaže viac zobrazení k radičom. Rozdeľuje SPA do viacerých zobrazení, aby logicky rozdelila aplikáciu a urobila ju spravovateľnejšou.

Príklad: predvolená trasa

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'
));
)));

  • filtre

Používajú sa na rozšírenie správania záväzného prejavu a smernice. Umožňuje formátovanie údajov a formátovanie hodnôt alebo uplatňovanie určitých podmienok. Filtre sú vyvolané v HTML s potrubím vo výrazoch.

Príklad:

< 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" ),
);
));

Vstup filtrovania:

    (((x.name | veľké) + ', ' + x.age + ', ' + x.city))

  • výrazov

Výrazy (()) sú deklaratívnym spôsobom, ako určiť umiestnenie dátovej väzby v HTML a použiť výraz pre dátovú väzbu. Môže sa pridať do šablón HTML a nepodporuje príkazy riadiacich tokov, ale podporuje filtre na formátovanie údajov pred ich zobrazením.

Príklad:

Vložte niečo do vstupného poľa:

Názov:

Napísali ste: ((firstName))

  • moduly

    Modul je kontajner aplikácie a radiče aplikácií patria do modulu. Je to zbierka funkcií a rozdeľuje aplikáciu na malú a opakovane použiteľnú funkčnú súčasť. Modul môže byť identifikovaný jedinečným názvom a môže závisieť od iných modulov.

Príklad:



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


  • testovanie

Na testovanie Angular JS Application code sa široko používajú testovacie rámce ako Jasmine a karma. Tieto testovacie rámce podporujú hlavne zosmiešňovanie a sú vysoko konfigurovateľné pomocou súboru JSON pomocou rôznych plug-in Angular JS Application.

Záver - Uhlová aplikácia JS

Angular JS poskytuje rámec, ktorý má jedinečné smernice a výkonné vlastnosti. Smernice nám pomáhajú pri vytváraní novej syntaxe HTML, ktorá je špecifická najmä pre aplikáciu. Používa sa ako opakovane použiteľné komponenty. Komponent umožňuje skryť zložitú štruktúru a ďalšie správanie. Dôraz by sa kládol iba na to, čo robí aplikácia a ako vyzerá samostatne. Aplikácia uhlového JS sa v týchto dňoch stáva populárnejšou, pretože je ľahké sa ju naučiť a vyvíjať. Na trhu existuje veľa príležitostí pre front-end vývojárov. Ak ste s JavaScriptom dobre, potom nebude pre vás Angular JS ťažké učiť sa a aktualizovať svoje zručnosti pomocou tejto technológie by bol skvelý nápad.

Odporúčané články

Tento článok bol sprievodcom aplikáciou Angular JS Application. Tu sme diskutovali o konceptoch aplikácie Angular JS Application s nejakým príkladom, aby sme lepšie porozumeli. Viac informácií nájdete aj v nasledujúcom článku.

  1. Rozdiely uhlov 5 a uhlov 4
  2. Čo je to strojové učenie?
  3. Rozdiely medzi JSON a BSON
  4. Čo je to Laravel Framework?
  5. Čo sú testovacie rámce pre Javu?

Kategórie:

Vývoj softvéru