AngularJS: Issue with watching arrays and deep $watch functionality

I'm having trouble using the $watch function in AngularJS with an array of boolean values. I want to display a message when there's a change in the array, but it's not working as expected.

Check out this code example where the array values are updated, but the $watch function doesn't detect the changes. Any suggestions?

View

<div data-ng-repeat="catA in categoryA">
    <b><input type="checkbox" checked="checked" ng-model="arrayCategoryA[$index]"/>{{catA.name}}</b>
</div>

Controller

app.controller("controllerApp", function($scope, $http, $filter){

  $scope.arrayCategoryA = [];

  $scope.$watchCollection($scope.arrayCategoryA, function(newVal, oldVal){
    console.log("something changed");
  }, true);

  $http.get("categoryA.json").success(function(data) {
     $scope.categoryA = data;
     for (var i = 0; i < $scope.categoryA.length; i++) 
     $scope.arrayCategoryA[i] = true;
  });

});

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

performing a jQuery AJAX call from a UIWebView during the initial launch of the app following installation

We have a uiWebview that uses jquery for an ajax request to log in. It functions flawlessly on mobile safari and all browsers. However, when the application is launched for the first time after installation, the ajax request seems to be sent out but no re ...

Invoke function within bxslider callback

I am attempting to utilize a custom function within a bxslider callback, but unfortunately, the function is not being recognized (specifically: Uncaught Reference Error: nextSlideCustom() is not a function) The current code snippet I have is as follows: ...

Creating a JSON object from text using JavaScript is a straightforward process

Looking to generate an object using the provided variable string. var text ='{"Origin":"Hybris","country":"Germany","Email":"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfem ...

Techniques for Grouping an Array of Objects by a Specific Value Key in Angular

I have the following array that needs to be grouped by section_name in HTML. Additionally, I need to first check if the length of the array values for section_name is greater than zero before displaying the results grouped by section_name. I hope my expl ...

Troubleshooting issues with applying styles in Vue framework when configured with webpack

I'm facing an issue with setting up the Vue framework using webpack. Specifically, I'm having trouble with styles not being applied when included in the <style> tag within single file components. Despite following several tutorials on this ...

Combining Arrays with a Certain Rule

I am dealing with different arrays structured like this: $reservations = ['reservationid' => '1', 'reservationid' => '2', 'reservationid' => '3'] $reservedrooms = ['reservationid& ...

Change the color of a c3js chart when it loads

I have been searching for a way to customize the color of a scatter chart's plot, and I came across an example that uses d3 code within the chart http://jsfiddle.net/ot19Lyt8/9/ onmouseover: function (d) { d3.select(d3.selectAll("circle ...

Learn how to leverage the drag and drop directive in AngularJS for your web

I integrated drag and drop functionality into my project using: https://github.com/marceljuenemann/angular-drag-and-drop-lists This is how I implemented it: <div ng-repeat="list in lists"> <div style="float: left; margin-left: 5px;"> ...

Limit access to route in ExpressJS only to internal redirects

I'm managing an ExpressJS application that includes specific routes which I intend to only function when redirected to from my code, rather than input directly into the URL. Essentially, if a user attempts to enter "myapp.com/url" it should not be ac ...

``Can anyone provide guidance on extracting data from Xmlhttprequest POST request on my Nodejs express backend?"

Is there a way to properly send the values of candid and candidresults to my backend route /savevote in Express? Any help on how to achieve this would be appreciated. var candid; var candidresults; ...

How can we convert a group of HTML elements sharing a common attribute into an array containing their respective values?

Consider the following HTML structure: <span class="L5" letters="a"></span> <span class="L5" letters="b"></span> <span class="L5" letters="c"></span> <span class="L5" letters="d"></span> <span class="L5" ...

Facing a challenge in configuring MongoDB automatic data expiration based on specific time zones

I am currently facing an issue with clearing data in MongoDB at the start of each day. For example, on July 15, 2020 at 00:00:00, data is deleted from the database based on a specific time. I am having trouble properly assigning the expiresAt attribute in ...

Tips for triggering window load event on a particular page

I need to trigger the windows.load event on a specific page. Currently, I have set it up like this: $(window).load(function(){ if(document.URL == "/car-driving.html") { overlay.show(); overlay.appendTo(document.body); $('.popup' ...

Understanding the extent of variables in Javascript

I'm struggling to comprehend the scope of 'this' in this particular situation. I can easily call each of these functions like: this.startTracking(); from within the time tracker switch object. However, when attempting to execute the code: Dr ...

What is the best way to load a local JSON file as the initial data source in Express and use it as an in

I'm in the process of creating a basic todo application using node.js express, and I've decided to work with an in-memory resource instead of utilizing a database. There's a local json file todo.json that contains some initial data which I ...

Trigger a function in JavaScript by clicking on an element and passing its class

I have written the following code: <?php $extCount = 0; foreach($this->externalReferal as $externalReferal) { $extCount++; ?> <div class='fieldtestPct' > <div class='fieldItemLabel'> < ...

Having trouble with the position function in JavaScript?

I'm working on creating a small game, but I've encountered some difficulties at the start. Every time I attempt to obtain the position of track or trackCont, it consistently returns x: 0, y: 0. The DIV doesn't move to the correct position w ...

What are the steps to transforming a regular expression into a dynamic format?

I've developed a powerful regex that locates specific text within a lengthy string without spaces. Now I'm attempting to utilize it dynamically to search for various words, but I can't seem to make it function as intended. Check out my rege ...

Having issue with jQuery popup not functioning correctly on the right side with the contact form. Is there anyone who knows how

Looking for a side slide popup that only accepts paragraph content? Want to add a contact form to it? Check out this fiddle - link here For a working example, visit - $(function() { // Slide from right to left $('#test2').PopupLayer({ ...

JSON schema for validating HTML forms

As someone new to Angular, I've been looking for ways to implement form validation using JSON schema with no luck so far. If anyone has any insights or solutions, I would greatly appreciate the help! ...