Introduktion til Angular JS-applikation

Angular JS er et open source-program. Det blev skrevet i JavaScript. Angular JS blev udviklet i 2010 af Google. Angular JS-applikation giver også en dynamisk henvisning til webapplikationer og sider. Angular JS giver dig mulighed for at udvide HTML-ordforrådet til din applikation. Vinkelformet JS bruges, fordi HTML smuldrer, når det bliver forsøgt at bruge til at erklære de dynamiske visninger i webapplikationer. Angular JS omtales som værktøjssæt til opbygning af det ramme, der er bedst egnet til din applikationsudvikling.

Vinklede JS-rammefunktioner kan ændres eller udskiftes, genanvendes for at passe mere eller unikke til arbejdsgang og til fremtidig reference. Det bliver fuldt udvideligt og fungerer også med andre biblioteker. AngularJS-applikationskode er almindelig i gamle javascript-objekter. Det gør din kode til at teste, vedligeholde, genbruge. I vinkelret JS er der ikke behov for at arve fra ejendomsret for at pakke modellerne op i accessorers metoder, som vi skal gøre i andre. Angular JS har fulgt de nyeste koncepter for udvikling.

Concepts of Angular JS Application

Begreberne Angular JS Application med deres eksempler er som følger:

  • Direktiver om udvidelse af HTML-attributter

Funktionsdirektivet er unikt og fås i andre rammer. Direktiverne er let skrevet og kan også være generiske, da de kan skrives en gang og genbruges mange gange. Direktiverne er virkelig nyttige, og der er mange grunde til at bruge, som når du har særlige behov som det tilpassede gitter eller anden funktionalitet, det direktiv, du ønsker, findes faktisk ikke endnu. Direktivet om kantet JS-applikation starter med 'ng-' som ng-pp, ng-controller, ng-view, ng-model, ng-class, ng-click, ng-src osv.

Eksempel:

Looping med ng-gentagelse:

    (( x ))

  • Anvendelsesområde

Det bruges til kommunikation mellem controller og visning. Det binder en visning til visningsmodellen og funktionerne, der er defineret i controller Angular JS-applikation understøtter indlejrede eller hierarkiske omfang. Det er en datakilde til Angular JS-applikation, og den kan tilføje eller fjerne egenskab, når det kræves. Al datamanipulation og tildeling af data sker gennem omfangsobjekt, hvornår CRUD-operation skal udføres.

  • Controllere

Disse bruges til at definere rækkevidden for visningerne, og rækkevidde kan tænkes på som variabler og funktioner, som visningen kan bruge en vis binding.

Eksempel:




First Name:

Last Name:


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

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

  • Dataindbinding

Det synkroniserer dataene mellem modellen og visningen. Det betyder, at ændringen i modellen opdaterer visningen. Direktivet om ng-modellen bruges til tovejsbinding.

Eksempel:
Når brugeren indtaster i tekstboksen, vises den ændrede værdi med store og små bogstaver på en etiket, der er tovejsbinding.

  • Services

Det bruges, når staten er blevet delt på tværs af applikationen og har brug for en løsning til datalagring. Det kan være en singleton og kan bruges af andre komponenter, såsom direktiver, controllere og andre tjenester. De tjenester, der bruges, er $ http, $ placering, $ log, $ rute, $ filter, $ dokument, $ timeout, $ exceptionHandler.

  • routing

Det hjælper med at opdele appen i flere visninger og binde flere visninger til controllere. Det opdeler SPA i flere visninger for logisk at opdele appen og gøre den mere håndterbar.

Eksempel: standardrute

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

Disse bruges til at udvide adfærden ved bindende udtryk og direktiv. Det tillader formatering af data og formatering af værdier eller anvendelse af visse betingelser. Filtre kaldes i HTML med udtrykket i røret indeni.

Eksempel:

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

Filtrering af input:

    (((x.navn | store bogstaver) + ', ' + x.age + ', ' + x.city))

  • Udtryk

Udtrykkene (()) er den erklærende måde at specificere databindingsplacering i HTML og bruge et udtryk til databinding. Det kan tilføjes i HTML-skabeloner og understøtter ikke kontrolstrømopgørelser, men det understøtter filtre til at formatere dataene, før de vises.

Eksempel:

Indtast noget i inputfeltet:

Navn:

Du skrev: ((firstName))

  • moduler

    Modulet er beholderen til en applikation, og applikationscontrollere hører til modulet. Det er en samling af funktioner og opdeler applikationen i den lille og genanvendelige funktionelle komponent. Et modul kan identificeres med et unikt navn og kan være afhængigt af andre moduler.

Eksempel:



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


  • Test

For at teste den kantede JS-applikationskode bruges testrammer i vid udstrækning som Jasmine og karma. Disse testrammer understøtter hovedsageligt hån og meget konfigurerbar ved hjælp af en JSON-fil ved hjælp af forskellige plug-in Angular JS-applikationer.

Konklusion - Angular JS-applikation

Angular JS leverer rammen, der har unikke direktiver og kraftfulde funktioner. Direktiver hjælper os med at opbygge den nye HTML-syntaks, der hovedsageligt er specifik for et program. Det bruges som genanvendelige komponenter. Komponenten giver dig mulighed for at skjule kompleks struktur og anden opførsel. Fokus vil kun være på, hvad applikationen gør, og hvordan applikationen ser separat ud. Vinkelformet JS-applikation bliver populært i disse dage, da det er let at lære og udvikle applikationen. Der er mange muligheder på markedet for frontend-udvikleren. Hvis du har det godt med JavaScript, vil Angular JS ikke være svært for dig at lære og at opdatere dine evner med denne teknologi ville være en god idé.

Anbefalede artikler

Denne artikel har været en guide til Angular JS-applikation. Her har vi diskuteret Concepts of Angular JS Application med et eksempel for at få en bedre forståelse. Du kan også se på den følgende artikel for at lære mere.

  1. Forskelle på vinkel 5 og vinkel 4
  2. Hvad er maskinlæring?
  3. Forskelle mellem JSON og BSON
  4. Hvad er Laravel Framework?
  5. Hvad er testrammer til Java?

Kategori:

Softwareudvikling