Différences

Ci-dessous, les différences entre deux révisions de la page.

--- richclient:emberjs:modelobjet:computed [2018/01/21 12:48] – [Macros] jcheron
+++ richclient:emberjs:modelobjet:computed [2019/08/31 14:21] (Version actuelle) – modification externe 127.0.0.1
@@ Ligne 34: / Ligne 34: @@
 Dans ce cas, la propriété **fullName** sera automatiquement mise à jour sur les changements de **firstName** ou **lastName**.
+===== Affectation : setter =====
+Il est possible de faire en sorte qu'une computed property soit modifiable :\\
+Il suffit dans ce cas de définir sa méthode **set** :
+<sxh javascript>
+import EmberObject, { computed } from '@ember/object';
+Person = EmberObject.extend({
+  firstName: null,
+  lastName: null,
+  fullName: computed('firstName', 'lastName', {
+    get(key) {
+      return `${this.get('firstName')} ${this.get('lastName')}`;
+    },
+    set(key, value) {
+      let [firstName, lastName] = value.split(/\s+/);
+      this.set('firstName', firstName);
+      this.set('lastName',  lastName);
+      return value;
+    }
+  })
+});
+let captainAmerica = Person.create();
+captainAmerica.set('fullName', 'William Burnside');
+captainAmerica.get('firstName'); // William
+captainAmerica.get('lastName'); // Burnside
+</sxh>
 ===== Macros =====
@@ Ligne 56: / Ligne 88: @@
 |< 100% >|
-^Macro exemple ^Rôle ^
+^Macro ^Exemple ^Rôle ^
-|and(keys) | effectue un ET logique entre les propriétés passées |
+|and |<sxh javascript;gutter:false>Ember.computed.and('hasWalkingStick', 'hasBackpack')</sxh> | retourne vrai si hasWalkingStick et hasBackpack sont vrais |
-|bool(keys) | convertit en booléen les propriétés |
+|bool |<sxh javascript;gutter:false>Ember.computed.bool('numBananas')</sxh> |retourne vrai si numBananas est différent de null et >0 |
-|collect(keys) | retourne un tableau des valeurs des propriétés |
+|collect |<sxh javascript;gutter:false>Ember.computed.collect('hat', 'shirt')</sxh> |retourne un tableau des valeurs des propriétés |
-|empty(keys) | retourne vrai si les propriétés passées sont vides (null, chaîne vide, tableau vide...) |
+|empty |<sxh javascript;gutter:false>Ember.computed.empty('todos')</sxh> |retourne vrai si les propriétés passées sont vides (null, chaîne vide, tableau vide...) |
-|<sxh javascript;gutter:false>Ember.computed.equal('percentCarrotsEaten', 100)</sxh> | retourne vrai si percentCarrotEaten est égal à 100 |
+|equal |<sxh javascript;gutter:false>Ember.computed.equal('percentCarrotsEaten', 100)</sxh> | retourne vrai si percentCarrotEaten est égal à 100 |
+|filter |<sxh javascript;gutter:false>let Hamster = Ember.Object.extend({
+  remainingChores: Ember.computed.filter('chores.@each.done', function(chore, index, array) {
+    return !chore.get('done');
+  })
+});</sxh> | retourne la liste des éléments correspondant au critère |
+|filterBy |<sxh javascript;gutter:false>let Hamster = Ember.Object.extend({
+  remainingChores: Ember.computed.filterBy('chores', 'done', false)
+});</sxh> | retourne la liste des éléments correspondant au critère |