EmberJS - Observateurs

L'observateur observe la propriété comme les propriétés calculées et met à jour le texte de la propriété calculée. Il se déclenche lorsque le texte est mis à jour ou modifié.

Syntaxe

funName1: Ember.computed(function() {
   //code here
}),

funName1: Ember.observer(function() {
   //code here
});

var varname = ClassName.create({
   //code here
});

Le tableau suivant répertorie les propriétés d'un observateur -

S.No. Propriété et description
1 Observateurs et asynchronie

Les observateurs dans un Ember.js sont actuellement synchrones.

2 Déclaration de l'observateur

Déclarer un observateur sans les extensions prototypes et en dehors des définitions de classe.

Exemple

L'exemple suivant montre comment mettre à jour le texte de la propriété calculée à l'aide de l'observateur -

import Ember from 'ember';

export default function() {
   var Person = Ember.Object.extend ({
      Name: null,
      
      //Defining the Details1 and Details2 computed property function
      Details1: Ember.computed('Name', function() {
         
         //get the Name value
         var Name = this.get('Name');
         //return the Name value
         return Name;
      }),

      Details2: Ember.observer('Details1', function() {
         this.set('Name','Steve Waugh');
      })
   });

   //initializing the Person details
   var person = Person.create ({
      //initial value of Name varialble
      Name: 'Mark Waugh'
   });

   //updating the value for 'firstName' using set() method
   document.write('<strong>The updated name : </strong>' +person.get('Details1'));
}

Ouvrez maintenant le fichier app.js et ajoutez la ligne suivante en haut du fichier -

import observers from './observers';

Où, observateurs est le nom du fichier spécifié comme "observers.js" et créé dans le dossier "app". Maintenant, appelez les "observateurs" hérités en bas, avant l'exportation. Il exécute la fonction d'observateurs qui est créée dans leobservers.js fichier -

observers();

Production

Exécutez le serveur de braises et vous recevrez la sortie suivante -