De JS $ scope-functies zijn enkele van de belangrijkste functies. In dit artikel bespreken we de Angular JS watch-functie in de volgende volgorde:
Wat is de hoekige JS-horlogefunctie?
De hoekige JS $ watch-functie wordt gebruikt om het scoopobject te bekijken. De $ watch houdt de variabele in de gaten en als de waarde van de variabele verandert, verandert de hoekige JS $ wat een functie uitvoert. Deze functie heeft twee argumenten, een is de nieuwe waarde en een andere parameter is de oude waarde.
model view controller in java
Hoe de hoekige JS-horlogefunctie te gebruiken?
Laten we een eenvoudig voorbeeld nemen van wat de horlogefunctie in hoekige JS precies doet. Dus in ons hoekige JS-programma hebben we twee bestanden gemaakt daar index.js is verantwoordelijk voor de frontend en de app.js is verantwoordelijk voor het afhandelen van de backend. Hier maken we een eenvoudig programma met een formulier en dit formulier heeft een invoerveld. Wanneer we de naam in het invoerveld geven, toont het uitvoerbericht ons de oude waarde en de nieuwe waarde.
java ondiepe kopie versus diepe kopie
HTML code
Onze index.html-pagina heeft een hoekige app met de naam ngWatchApp en een controller met de naamwatchController. Vervolgens maken we een formulier met een invoerveldnaam en de waarde van dat invoerveld die we afdrukken in h1-tag en het bericht wordt afgedrukt in
label.
Voorbeeld van een hoekig horloge Voer uw naam in{{bericht}}
JavaScript-code
In de app.js hebben we een app gemaakt met de naam ngWatchApp en een controller met de naamwatchController. Vervolgens definiëren we de twee variabelen in bereik met de naam, naam en bericht en in de bewakingsfunctie geven we twee parameters door, een is de naam van het veld dat wordt beïnvloed bij verandering en de andere is de functie die ook twee parameters heeft, nieuwe waarde en oude waarde. Ten slotte voegen we twee waarden toe aan de berichtvariabele en dat de berichtvariabele wordt weergegeven op deindex.htmlbladzijde.
cross-browser testen met behulp van selenium
var app = angular.module ('ngWatchApp', []) app.controller ('watchController', function ($ scope) {// bereikvariabele toevoegen $ scope.name = '' $ scope.message = '' // add watch with name field $ scope. $ watch ('name', function (newValue = '', oldValue = '') {$ scope.message = `nieuwe waarde is $ {newValue} en oude waarde is $ {oldValue}`} )})Telkens wanneer we een functie bekijken, wordt deze functie meerdere keren aangeroepen volgens de samenvatting. Telkens wanneer de code wordt uitgevoerd, geeft AngularJS de huidige $ scope-verwijzing door als het eerste argument. Het betekent niet alleen dat we kunnen verwijzen naar het juiste bereik vanuit de hoofdtekst van de functie, het betekent ook dat we elke functie kunnen bekijken die een $ scope-referentie verwacht.
Dit is hoe we de angulaire js watch () -functie in applicaties kunnen gebruiken om $ scope variabele veranderingen te bekijken. Er zijn enkele andere dingen die werken met $ watch, deze zijn $ digest () functie itereert door alle horloges in het $ scope-object wanneer$ samenvatting ()itereert over de horloges, het roept de waardefunctie voor elk horloge op. De$ scope. $ apply ()functie neemt een functie als parameter die wordt uitgevoerd, en daarna$ scope. $ digest ()wordt intern gebeld.
Hiermee komen we aan het einde van dit Angular JS watch Function-artikel. Als je meer wilt weten over Angular framework, bekijk dan onze die wordt geleverd met live training onder leiding van een instructeur en real-life projectervaring. Deze training zal je helpen Angular diepgaand te begrijpen en je te helpen het onderwerp onder de knie te krijgen.
Heeft u een vraag voor ons? Vermeld het in het opmerkingengedeelte van 'Angular JS Watch Function' en we nemen contact met u op.