fix(components): update criteria

src/component/association-select.js

@@ -8,7 +8,7 @@ import {EntityManager, Entity, OrmMetadata} from '../aurelia-orm';
 @customElement('association-select')
 @inject(BindingEngine, EntityManager, Element)
 export class AssociationSelect {
-  @bindable criteria = null;
+  @bindable criteria;
 
   @bindable repository;
 
@@ -24,7 +24,7 @@ export class AssociationSelect {
 
   @bindable manyAssociation;
 
-  @bindable({defaultBindingMode: bindingMode.twoWay}) value;
+  @bindable({defaultBindingMode: bindingMode.twoWay}) value ;
 
   @bindable({defaultBindingMode: bindingMode.twoWay}) error;
 
@@ -104,7 +104,7 @@ export class AssociationSelect {
       return {};
     }
 
-    return JSON.parse(JSON.stringify(this.criteria));
+    return JSON.parse(JSON.stringify(this.criteria || {}));
   }
 
   /**
@@ -189,9 +189,22 @@ export class AssociationSelect {
   }
 
   /**
-   * Change resource
-   * @param  {string resource New resource value
+   * Check if the value is changed
+   *
+   * @param  {string|{}}   newVal New value
+   * @param  {[string|{}]} oldVal Old value
+   * @return {Boolean}     Whenever the value is changed
    */
+  isChanged(property, newVal, oldVal) {
+    return !this[property] || !newVal || (newVal === oldVal);
+  }
+
+  /**
+ * Change resource
+ *
+ * @param  {{}} newVal New criteria value
+ * @param  {{}} oldVal Old criteria value
+ */
   resourceChanged(resource) {
     if (!resource) {
       logger.error(`resource is ${typeof resource}. It should be a string or a reference`);
@@ -200,6 +213,23 @@ export class AssociationSelect {
     this.repository = this.entityManager.getRepository(resource);
   }
 
+    /**
+   * Change criteria
+   *
+   * @param  {{}} newVal New criteria value
+   * @param  {{}} oldVal Old criteria value
+   */
+  criteriaChanged(newVal, oldVal) {
+    if (this.isChanged('criteria', newVal, oldVal)) {
+      return;
+    }
+
+    if (this.value) {
+      this.load(this.value);
+    }
+  }
+
+
   /**
    * When attached to the DOM, initialize the component.
    */

src/component/paged.js

@@ -43,8 +43,8 @@ export class Paged {
    * @param  {[string|{}]} oldVal Old value
    * @return {Boolean}     Whenever the value is changed
    */
-  isChanged(newVal, oldVal) {
-    return !this.resource || !newVal || (newVal === oldVal);
+  isChanged(property, newVal, oldVal) {
+    return !this[property] || !newVal || (newVal === oldVal);
   }
 
   /**
@@ -54,21 +54,37 @@ export class Paged {
    * @param  {integer} oldVal Old page value
    */
   pageChanged(newVal, oldVal) {
-    if (this.isChanged(newVal, oldVal)) {
+    if (this.isChanged('resource', newVal, oldVal)
+      || this.isChanged('criteria', newVal, oldVal)) {
       return;
     }
 
     this.reloadData();
   }
 
+  /**
+   * Change resource
+   *
+   * @param  {{}} newVal New resource value
+   * @param  {{}} oldVal Old resource value
+   */
+  resourceChanged(newVal, oldVal) {
+    if (this.isChanged('resource', newVal, oldVal)) {
+      return;
+    }
+
+    this.reloadData();
+  }
+
+
   /**
    * Change criteria
    *
    * @param  {{}} newVal New criteria value
    * @param  {{}} oldVal Old criteria value
    */
   criteriaChanged(newVal, oldVal) {
-    if (this.isChanged(newVal, oldVal)) {
+    if (this.isChanged('criteria', newVal, oldVal)) {
       return;
     }