Observando alterações interna no valor de um array utilizando AngularJS

Um erro muito comum entre programadores que passam a utilizar o AngularJS, é numa necessidade de observar a mudança de valores interno de um array, cometerem o engano de observarem apenas variações na variável que contém o array.

Em geral, os iniciantes efetuam a observação de mudança de valores da seguinte forma:

var aDados = [
    {
        "id":1
        "nome":"Drall Consultoria"
    }
];

$scope.$watch( 'aDados', function(){});

Este modo, não irá verificar qualquer mudança interna nos valores do array. Para este tipo de comportamento, é necessário utilizar o terceiro parâmetro da função $watch.

var aDados = [
    {
        "id":1
        "nome":"Drall Consultoria"
    }
];

$scope.$watch( 'aDados', function(){},true);

Este é o modo AngularJS de utilizar a função $watch para observar mudanças internas/de valores em um array javascript. Ao se adicionar um novo valor no aDados, a function(){} será executada neste segundo exemplo, ao contrário do primeiro, que necessitaria de uma mudança da variável observada em si. Mudanças interna no array do primeiro exemplo não efetuam qualquer alteração na função.

Gostou? Tire um minutinho e dê sua contribuição para Drall Dev Community no Patreon!

Artigos relacionados:

JavaScript – Comportamento de arrays como argumento de funções. Referência ou valor? VueJS – $Watch e uma pequena comparação para os que vieram do Angular1.x Efetuando cópia de array em JavaScript Como adicionar um elemento no meio de um array em PHP Problemas com AngularJS e componente tab original do Bootstrap ou jQueryUI AngularJS – Observando mudanças com $watch no model Como copiar array em javascript por valor e não por referencia Recarregar uma página HTML utilizando AngularJS Evitando uso de variáveis globais em sistemas utilizando AngularJs