EmberJS - Mise à jour dynamique du modèle objet

Les propriétés calculées détectent les modifications apportées aux propriétés et mettent à jour dynamiquement la propriété calculée lorsqu'elles sont appelées à l'aide de la méthode set ().

Syntaxe

ClassName.set('VariableName', 'UpdatedValue');

Exemple

L'exemple suivant montre une valeur mise à jour dynamiquement lorsque des modifications sont apportées aux propriétés -

import Ember from 'ember';

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

      Details2: Ember.computed('age', 'mobno', function() {
         return 'Name: ' + this.get('Details1') + '<br>' + ' Age: ' + this.get('age') + 
            '<br>' + ' Mob No: ' + this.get('mobno');
      }),
   });

   //initializing the Person details
   var person_details = Person.create ({
      //Dynamically Updating the properties
      firstName: 'Jhon',
      lastName: 'Smith',
      age: 26,
      mobno: '1234512345'
   });

   //updating the value for 'firstName' using set() method
   person_details.set('firstName', 'Steve');
   document.write("<h2>Details of the Person: <br></h2>");
   document.write(person_details.get('Details2'));
}

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

import dynamicupdating from './dynamicupdating';

Où, dynamicupdating est un nom du fichier spécifié comme "dynamicupdating.js" et créé dans le dossier "app".

Appelez ensuite la "mise à jour dynamique" héritée en bas, avant l'exportation. Il exécute la fonction dynamicupdating qui est créée dans le fichier dynamicupdating.js -

dynamicupdating();

Production

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