Uvod u kutnu aplikaciju JS

Angular JS je aplikacija otvorenog koda. Napisala je JavaScript. Angular JS razvio je 2010. godine Google. Kutna JS aplikacija pruža dinamičnu referencu na web aplikacije i stranice. Angular JS omogućava vam da proširite HTML vokabular za svoju aplikaciju. Kutni JS koristi se zbog toga što se HTML pokvari kada se pokušava koristiti za proglašavanje dinamičkih prikaza u web aplikacijama. Kutni JS naziva se skupom alata za izgradnju okvira koji najviše odgovara vašem razvoju aplikacija.

Kutne karakteristike okvira JS mogu se mijenjati ili zamijeniti, ponovo koristiti za prilagođavanje više ili jedinstvene tijeku rada i za buduću upotrebu. U potpunosti je proširiv i surađuje s ostalim knjižnicama. AngularJS aplikacijski kôd je običan u starim JavaScript objektima. To čini vaš kôd za testiranje, održavanje, ponovnu upotrebu. U kutnom JS-u nema potrebe nasljeđivati ​​vlasničke tipove da bismo zamotali modele u metode pristupa kao što je to slučaj kod drugih. Kutni JS slijedio je najnovije koncepte razvoja.

Pojmovi kutne aplikacije JS

Koncepti kutne aplikacije JS sa njihovim primjerima su sljedeći:

  • Smjernice za proširenje atributa HTML-a

Direktiva značajki jedinstvena je i dostupna je u drugim okvirima. Direktive se pišu lako, a mogu biti i generičke, kao što se mogu napisati jednom i ponovo upotrebljavati više puta. Direktive su zaista korisne i postoje mnogi razlozi za korištenje kao kad imate posebne potrebe kao prilagođenu mrežu ili drugu funkciju, a direktiva koju želite još uvijek ne postoji. Direktiva Angular JS Application počinje s 'ng-' poput ng-pp, ng-kontrolera, ng-pogleda, ng-modela, ng-klase, ng-klika, ng-src-a, itd.

Primjer:




Petljajte pomoću ng-ponavljanja:

    (( x ))
  • djelokrug

Koristi se za komunikaciju između kontrolera i prikaza. Veže pogled na model prikaza i funkcije definirane u regulatoru Angular JS Application podržava ugniježđene ili hijerarhijske domete. To je izvor podataka za Angular JS aplikaciju i po potrebi može dodati ili ukloniti svojstvo. Sve manipulacije i dodjeljivanje podataka događaju se kroz objekt opsega kada treba raditi CRUD operaciju.

  • kontroleri

Koriste se za definiranje opsega za prikaze, a opseg se može smatrati varijablama i funkcijama za koje pogled može koristiti neko vezivanje.

Primjer:




First Name:

Last Name:


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

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

  • Vezivanje podataka

Ona sinkronizira podatke između modela i prikaza. To znači da će promjena modela ažurirati pogled. Direktiva ng-modela koristi se za dvosmjerno vezivanje podataka.

Primjer:
Kad korisnik upiše u tekstni okvir, promijenjena vrijednost prikazuje se velikim i malim slovima u naljepnici koja je dvosmjerna vezanja podataka.

  • usluge

Koristi se kada se država dijeli preko aplikacije i treba rješenje za pohranu podataka. Može biti singleton, a mogu se koristiti i druge komponente poput direktiva, kontrolera i drugih usluga. Korištene usluge su $ http, $ location, $ log, $ route, $ filter, $ document, $ timeout, $ iznimkaHandler.

  • usmjeravanje

Pomaže u podjeli aplikacije na više pogleda i veže više prikaza s kontrolerima. Dijeli SPA na više pogleda kako bi logično podijelio aplikaciju i učinio je upravljivijom.

Primjer: zadana ruta

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

  • filteri

Oni se koriste za širenje ponašanja obvezujućeg izraza i direktive. Omogućuje formatiranje podataka i oblikovanje vrijednosti ili primjenu određenih uvjeta. Filtri se pozivaju u HTML s izraženom unutarnjom izrazom.

Primjer:

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

Filtriranje ulaza:

    (((x.name | velika slova) + ', ' + x.age + ', ' + x.city))
  • izrazi

Izrazi (()) su deklarativni način određivanja lokacije vezanja podataka u HTML-u i korištenja izraza za vezivanje podataka. Može se dodati u HTML predloške i ne podržava izjave kontrolnog toka, ali podržava filtre za oblikovanje podataka prije prikazivanja.

Primjer:




Unesite nešto u polje za unos:

Ime:

Napisali ste: ((firstName))

  • moduli

    Modul je spremnik aplikacije, a kontroleri aplikacije pripadaju modulu. To je skup funkcija i aplikaciju dijeli na malu i višekratnu funkcionalnu komponentu. Modul se može identificirati jedinstvenim nazivom i može ovisiti o drugim modulima.

Primjer:



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


  • Testiranje

Za testiranje kutnog koda aplikacije JS široko se koriste okviri za testiranje poput Jasmina i karme. Ovi okviri za testiranje uglavnom podržavaju podsmijeh i dobro se konfiguriraju pomoću datoteke JSON uz pomoć različitih dodataka Angular JS Application.

Zaključak - Kutna aplikacija JS

Kutni JS pruža okvir koji ima jedinstvene direktive i snažne značajke. Direktive pomažu nam u izgradnji nove sintakse HTML koja je uglavnom specifična za aplikaciju. Koristi se kao dijelovi za višekratnu uporabu. Komponenta vam omogućuje sakrivanje složene strukture i drugog ponašanja. Fokus bi bio samo na onome što aplikacija radi i kako aplikacija izgleda odvojeno. Kutna aplikacija JS ovih je dana sve popularnija među onima jer je program lako učiti i razvijati. Na tržištu postoji puno mogućnosti za razvojne programere. Ako ste dobri s JavaScript-om, tada vam kutni JS neće biti težak za učenje, a odlična ideja bila bi ažurirati vaše vještine ovom tehnologijom.

Preporučeni članci

Ovaj je članak vodič za ugaonu aplikaciju JS. Ovdje smo raspravljali o Konceptima kutne aplikacije JS s nekim primjerom kako bismo bolje razumjeli. Možete pogledati i slijedeći članak kako biste saznali više.

  1. Razlike kuta 5 i kuta 4
  2. Što je strojno učenje?
  3. Razlike između JSON i BSON
  4. Što je Laravel Framework?
  5. Što je testiranje okvira za Java?

Kategorija: