AngularJS: Diferencia entre los métodos observe observe y watch watch

$observar() es un método en el objeto Attributes , y como tal, solo se puede usar para observar/observar el cambio de valor de un atributo DOM. Solo se usa / llama dentro de directivas. Use observe observe cuando necesite observar / observar un atributo DOM que contenga interpolación (es decir, {{}} 's).
Por ejemplo, attr1="Name: {{name}}", luego en una directiva: attrs.$observe('attr1', ...).
(Si intentas scope.$watch(attrs.attr1, ...) no funcionará debido a la {{}}s get obtendrás undefined.) Use watch esté atento a todo else.

$reloj() es más complicado. Puede observar / observar una "expresión", donde la expresión puede ser una función o una cadena. Si la expresión es una cadena, es par parse'd (es decir, evaluado como una expresión angular ) en una función. (Es esta función que se llama cada ciclo de digestión.)La expresión de cadena no puede contener {{}} ' s. watch watch es un método en el objeto Scope , por lo que se puede usar / llamar donde quiera que tener acceso a un objeto de ámbito, por lo tanto en

• un controlador any cualquier controlador created uno creado a través de ng-view, ng-controller, o un controlador de directiva
• una función de enlace en una directiva, ya que esta también tiene acceso a un ámbito de aplicación

Debido a que las cadenas se evalúan como expresiones angulares, $watch se usa a menudo cuando se desea observar/observar una propiedad model/scope. Por ejemplo, attr1="myModel.some_prop", luego en un controlador o función de enlace: scope.$watch('myModel.some_prop', ...) o scope.$watch(attrs.attr1, ...) (o scope.$watch(attrs['attr1'], ...)).
(Si intenta attrs.$observe('attr1') obtendrás la cadena myModel.some_prop, que probablemente no es lo que quieres.)

Como se discutió en los comentarios de la respuesta de @PrimosK, todos los observes observa y watches observa se comprueban cada ciclo de digest.

Las directivas con ámbitos aislados son más complicadas. Si se utiliza la sintaxis'@', se puede observe observar o watch observar un atributo DOM que contiene interpolación (es decir, {{}} ' s). (La razón por la que funciona con watch watch es porque la sintaxis ' @ ' hace la interpolación para us, por lo tanto watch watch ve una cadena sin {{}}'s.) Para que sea más fácil recordar cuál usar cuando, sugiero usar observe observe para este caso también.

Para ayudar a probar todo esto, escribí un Plunker que define dos directivas. Uno (d1) no crea un nuevo ámbito, el otro (d2) crea un ámbito aislado. Cada directiva tiene los mismos seis atributos. Cada atributo es a la vez observe observado y watch vigilado.

<div d1 attr1="{{prop1}}-test" attr2="prop2" attr3="33" attr4="'a_string'"
        attr5="a_string" attr6="{{1+aNumber}}"></div>

Mire el registro de la consola para ver las diferencias entre observe observe y watch observe en la función de enlace. A continuación, haga clic en el enlace y vea qué observes observes y watches watches se activan por los cambios de propiedad realizados por el controlador de clics.

Observe que cuando se ejecuta la función de enlace, cualquier atributo que contenga {{}} no se evalúa todavía (por lo que si intenta examinar los atributos, obtendrá undefined). La única manera de ver los valores interpolados es usar observe observe (o watch watch si se usa un ámbito aislado con '@'). Por lo tanto, obtener los valores de estos attributes es una operación asíncrona. (Y esta es la razón por la que necesitamos las funciones observe observe y watch watch.)

A veces no necesitas observe observar o watch observar. Por ejemplo, si su atributo contiene un número o un booleano (no una cadena), solo evalúelo una vez: attr1="22", luego, digamos, su función de enlace: var count = scope.$eval(attrs.attr1). Si es solo una cadena constante - attr1="my string" – entonces simplemente use attrs.attr1 en su directiva (no necesita $eval()).

Véase también La publicación del grupo google de Vojta acerca de watch ver expresiones.