diff --git a/packages/core/src/render3/query.ts b/packages/core/src/render3/query.ts index e12d4b84bb..bcb8827ee3 100644 --- a/packages/core/src/render3/query.ts +++ b/packages/core/src/render3/query.ts @@ -10,6 +10,7 @@ // correctly implementing its interfaces for backwards compatibility. import {Observable} from 'rxjs/Observable'; +import {EventEmitter} from '../event_emitter'; import {QueryList as viewEngine_QueryList} from '../linker/query_list'; import {Type} from '../type'; import {getSymbolIterator} from '../util'; @@ -295,7 +296,7 @@ function createPredicate( class QueryList_/* implements viewEngine_QueryList */ { readonly dirty = true; - readonly changes: Observable; + readonly changes: Observable = new EventEmitter(); private _values: T[] = []; /** @internal */ _valuesTree: any[] = []; @@ -367,9 +368,12 @@ class QueryList_/* implements viewEngine_QueryList */ { (this as{dirty: boolean}).dirty = false; } - notifyOnChanges(): void { throw new Error('Method not implemented.'); } + notifyOnChanges(): void { (this.changes as EventEmitter).emit(this); } setDirty(): void { (this as{dirty: boolean}).dirty = true; } - destroy(): void { throw new Error('Method not implemented.'); } + destroy(): void { + (this.changes as EventEmitter).complete(); + (this.changes as EventEmitter).unsubscribe(); + } } // NOTE: this hack is here because IQueryList has private members and therefore @@ -396,6 +400,7 @@ export function queryRefresh(query: QueryList): boolean { const queryImpl = (query as any as QueryList_); if (query.dirty) { query.reset(queryImpl._valuesTree); + query.notifyOnChanges(); return true; } return false; diff --git a/packages/core/test/render3/query_spec.ts b/packages/core/test/render3/query_spec.ts index 11ad7b8a28..fdb8005bda 100644 --- a/packages/core/test/render3/query_spec.ts +++ b/packages/core/test/render3/query_spec.ts @@ -826,4 +826,34 @@ describe('query', () => { }); }); + + describe('observable interface', () => { + + it('should allow observing changes to query list', () => { + const queryList = new QueryList(); + let changes = 0; + + queryList.changes.subscribe({ + next: (arg) => { + changes += 1; + expect(arg).toBe(queryList); + } + }); + + // initial refresh, the query should be dirty + qR(queryList); + expect(changes).toBe(1); + + + // refresh without setting dirty - no emit + qR(queryList); + expect(changes).toBe(1); + + // refresh with setting dirty - emit + queryList.setDirty(); + qR(queryList); + expect(changes).toBe(2); + }); + + }); });