AngularJS – Observando mudanças com $watch no model

image_pdfimage_print

Provavelmente a função de $scope mais utilizada no AngularJS é a $watch, que é responsável por notificar o programador por toda mudança ocorrida no model para a variável solicitada. Você pode observar propriedades de objetos individualmente e resultado de processamentos de funções.

A assinatura da função é:
$watch(watchFn, watchAction, deepWatch);

O retorno desta função é uma função que irá desregistrar o listener/observação da variável, o que pode ser utilizado para quando o programador não mais desejar observar modificações ou mudanças na variável.

Os detalhes de cada parâmetro da função $watch são os seguintes:
watchFn: Esta será a expressão, no formato string ou função, que será observada. Qualquer modificação ocorrida, efetuará a ação declarada no parâmetro watchAction.
Se o valor indicado for uma string, esta variável será uma variável definida na variável $scope.

É importante ressaltar que esta verificação ocorrerá diversas vezes. Deste modo, o programador deve estar atento para não efetuar processamentos de verificações que possam afetar a performance do programa.

watchAction: Função ou expressão a ser executada em cada verificação de mudança na variável observada (parâmetro watchFn)

deepWatch: Se este parâmetro opcional for definido como true, o AngularJS irá observar cada propriedade do objeto observado. Deve-se ter atenção, visto que será percorrido todos os elementos de um array ou todos os atributos de um objeto, o que pode ser computacionalmente custoso.

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