Inleiding tot Angular JS Application

Angular JS is een open-source applicatie. Het is geschreven in JavaScript. Angular JS werd ontwikkeld in het jaar 2010 door Google. Angular JS-applicatie biedt ook een dynamische verwijzing naar web-applicaties en pagina's. Met Angular JS kunt u de HTML-woordenschat voor uw toepassing uitbreiden. Angular JS wordt gebruikt omdat HTML hapert wanneer het wordt gebruikt om de dynamische weergaven in webapplicaties te declareren. Angular JS wordt de toolset genoemd voor het bouwen van het Framework dat het meest geschikt is voor uw applicatie-ontwikkeling.

Hoekige JS-frameworkfuncties kunnen worden gewijzigd of vervangen, opnieuw worden gebruikt om meer of uniek te zijn voor de workflow en voor toekomstige referentie. Het is volledig uitbreidbaar en werkt ook met andere bibliotheken. AngularJS-toepassingscode is duidelijk in oude javascript-objecten. Het maakt uw code om te testen, onderhouden, hergebruiken. In hoekige JS is het niet nodig om van eigen typen te erven om de modellen in accessors-methoden te verpakken zoals we in andere moeten doen. Angular JS heeft de nieuwste ontwikkelingsconcepten gevolgd.

Concepten van hoekige JS-toepassing

De concepten van Angular JS Application met hun voorbeelden zijn als volgt:

  • Richtlijnen om HTML-kenmerken uit te breiden

De functierichtlijn is uniek en beschikbaar in andere frameworks. De richtlijnen zijn eenvoudig te schrijven en kunnen generiek zijn, omdat ze eenmaal kunnen worden geschreven en vele malen opnieuw kunnen worden gebruikt. De richtlijnen zijn erg handig en er zijn veel redenen om te gebruiken, zoals wanneer u speciale behoeften hebt, zoals het aangepaste raster of andere functionaliteit, de gewenste richtlijn bestaat echt nog niet. De Angular JS Application-richtlijn begint met 'ng-' zoals ng-pp, ng-controller, ng-view, ng-model, ng-class, ng-click, ng-src, etc.

Voorbeeld:




Looping met ng-repeat:

    ((x))
  • strekking

Het wordt gebruikt voor de communicatie tussen controller en weergave. Het bindt een weergave aan het weergavemodel en functies die zijn gedefinieerd in Angular JS Application van de controller ondersteunt geneste of hiërarchische scopes. Het is een gegevensbron voor Angular JS Application en kan indien nodig eigenschappen toevoegen of verwijderen. Alle gegevensmanipulatie en toewijzing van gegevens gebeurt via het bereikobject wanneer de CRUD-bewerking wordt uitgevoerd.

  • Controllers

Deze worden gebruikt om het bereik voor de aanzichten te definiëren en het bereik kan worden gezien als variabelen en functies die in het aanzicht enige binding kunnen gebruiken.

Voorbeeld:




First Name:

Last Name:


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

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

  • Dataverbinding

Het synchroniseert de gegevens tussen het model en de weergave. Dit betekent dat de weergave in het model wordt bijgewerkt. De ng-modelrichtlijn wordt gebruikt voor tweerichtingsgegevensbinding.

Voorbeeld:
Wanneer de gebruiker in het tekstvak typt, wordt de gewijzigde waarde in hoofdletters en kleine letters weergegeven in een label dat tweerichtingsgegevensbinding is.

  • Diensten

Het wordt gebruikt wanneer de status in de toepassing is gedeeld en een oplossing voor gegevensopslag nodig heeft. Het kan een singleton zijn en kan worden gebruikt door andere componenten zoals richtlijnen, controllers en andere services. De gebruikte services zijn $ http, $ locatie, $ log, $ route, $ filter, $ document, $ timeout, $ exceptionHandler.

  • routing

Het helpt bij het verdelen van de app in meerdere weergaven en verbindt meerdere weergaven aan controllers. Het verdeelt de SPA in meerdere weergaven om de app logisch te verdelen en beheersbaar te maken.

Voorbeeld: standaardroute

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

  • filters

Deze worden gebruikt om het gedrag van bindende expressie en richtlijn uit te breiden. Hiermee kunt u de gegevens formatteren en waarden opmaken of bepaalde voorwaarden toepassen. Filters worden in HTML aangeroepen met de pijp binnen uitdrukkingen.

Voorbeeld:

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

Filteringang:

    (((x.name | hoofdletters) + ', ' + x.age + ', ' + x.city))
  • Uitdrukkingen

De uitdrukkingen (()) zijn de declaratieve manier om gegevensbindingslocatie in HTML op te geven en een uitdrukking te gebruiken voor gegevensbinding. Het kan worden toegevoegd in HTML-sjablonen en ondersteunt geen control flow-instructies, maar het ondersteunt filters om de gegevens te formatteren voordat ze worden weergegeven.

Voorbeeld:




Voer iets in het invoervak ​​in:

Naam:

U schreef: ((firstName))

  • modules

    De module is de container van een applicatie en applicatiecontrollers behoren tot de module. Het is een verzameling functies en verdeelt de toepassing in de kleine en herbruikbare functionele component. Een module kan worden geïdentificeerd met een unieke naam en kan afhankelijk zijn van andere modules.

Voorbeeld:



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


  • testen

Om de Angular JS Application-code te testen, worden testkaders veel gebruikt, zoals Jasmine en Karma. Deze testframes ondersteunen voornamelijk mocking en zijn zeer configureerbaar met behulp van een JSON-bestand met behulp van verschillende plug-in Angular JS-applicaties.

Conclusie - Angular JS Application

Angular JS biedt het framework met unieke richtlijnen en krachtige functies. Richtlijnen helpen ons bij het bouwen van de nieuwe HTML-syntaxis die vooral specifiek is voor een toepassing. Het wordt gebruikt als herbruikbare componenten. Met de component kunt u complexe structuren en ander gedrag verbergen. De nadruk zou alleen liggen op wat de applicatie doet en hoe de applicatie er apart uitziet. Angular JS-applicatie wordt tegenwoordig populair onder de omdat het gemakkelijk is om de applicatie te leren en te ontwikkelen. Er zijn veel kansen op de markt voor de front-end ontwikkelaar. Als je goed bent met JavaScript, zal Angular JS niet moeilijk voor je zijn om te leren en je vaardigheden met deze technologie bij te werken zou een geweldig idee zijn.

Aanbevolen artikelen

Dit artikel is een gids voor Angular JS Application geweest. Hier hebben we de Concepts of Angular JS Application met een paar voorbeelden besproken om een ​​beter begrip te krijgen. U kunt ook het volgende artikel bekijken voor meer informatie.

  1. Verschillen van hoek 5 en hoek 4
  2. Wat is machinaal leren?
  3. Verschillen tussen JSON en BSON
  4. Wat is Laravel Framework?
  5. Wat is testframes voor Java?