iSharkFly-Docs/angular-docs-cn
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(query): make QueryList notify on changes via an observable

Browse Source 
BREAKING CHANGE:

Before: query.onChange(() => ...);
After: query.changes.subscribe((iterable) => {});

Closes #4395
This commit is contained in:
vsavkin
2015-09-30 08:41:00 -07:00
committed by Victor Savkin
parent 9b7378d132
commit 3aa204791b
8 changed files with 131 additions and 180 deletions
Download Patch File Download Diff File Expand all files Collapse all files
modules/angular2/test/core/compiler/query_integration_spec.ts
+5 -4
View File
@@ -13,6 +13,7 @@ import {
} from 'angular2/test_lib';
import {isPresent} from 'angular2/src/core/facade/lang';
import {ObservableWrapper} from 'angular2/src/core/facade/async';
import {
Component,
@@ -263,7 +264,7 @@ export function main() {
});
describe("onChange", () => {
describe("changes", () => {
it('should notify query on change',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<needs-query #q>' +
@@ -277,7 +278,7 @@ export function main() {
var q = view.debugElement.componentViewChildren[0].getLocal("q");
view.detectChanges();
q.query.onChange(() => {
ObservableWrapper.subscribe(q.query.changes, (_) => {
expect(q.query.first.text).toEqual("1");
expect(q.query.last.text).toEqual("2");
async.done();
@@ -304,8 +305,8 @@ export function main() {
var firedQ2 = false;
q2.query.onChange(() => { firedQ2 = true; });
q1.query.onChange(() => {
ObservableWrapper.subscribe(q2.query.changes, (_) => { firedQ2 = true; });
ObservableWrapper.subscribe(q1.query.changes, (_) => {
expect(firedQ2).toBe(true);
async.done();
});
modules/angular2/test/core/compiler/query_list_spec.ts
+45 -63
View File
@@ -1,8 +1,21 @@
import {describe, it, expect, beforeEach, ddescribe, iit, xit, el} from 'angular2/test_lib';
import {
describe,
it,
expect,
beforeEach,
ddescribe,
iit,
xit,
el,
fakeAsync,
tick
} from 'angular2/test_lib';
import {MapWrapper, ListWrapper, iterateListLike} from 'angular2/src/core/facade/collection';
import {StringWrapper} from 'angular2/src/core/facade/lang';
import {ObservableWrapper} from 'angular2/src/core/facade/async';
import {QueryList} from 'angular2/src/core/compiler/query_list';
import {DOM} from 'angular2/src/core/dom/dom_adapter';
export function main() {
@@ -16,95 +29,64 @@ export function main() {
function logAppend(item) { log += (log.length == 0 ? '' : ', ') + item; }
it('should support adding objects and iterating over them', () => {
queryList.add('one');
queryList.add('two');
iterateListLike(queryList, logAppend);
expect(log).toEqual('one, two');
});
it('should support resetting and iterating over the new objects', () => {
queryList.add('one');
queryList.add('two');
queryList.reset(['one again']);
queryList.add('two again');
queryList.reset(['one']);
queryList.reset(['two']);
iterateListLike(queryList, logAppend);
expect(log).toEqual('one again, two again');
expect(log).toEqual('two');
});
it('should support length', () => {
queryList.add('one');
queryList.add('two');
queryList.reset(['one', 'two']);
expect(queryList.length).toEqual(2);
});
it('should support map', () => {
queryList.add('one');
queryList.add('two');
queryList.reset(['one', 'two']);
expect(queryList.map((x) => x)).toEqual(['one', 'two']);
});
it('should support toString', () => {
queryList.add('one');
queryList.add('two');
queryList.reset(['one', 'two']);
var listString = queryList.toString();
expect(StringWrapper.contains(listString, 'one')).toBeTruthy();
expect(StringWrapper.contains(listString, 'two')).toBeTruthy();
});
it('should support first and last', () => {
queryList.add('one');
queryList.add('two');
queryList.add('three');
queryList.reset(['one', 'two', 'three']);
expect(queryList.first).toEqual('one');
expect(queryList.last).toEqual('three');
});
describe('simple observable interface', () => {
it('should fire callbacks on change', () => {
var fires = 0;
queryList.onChange(() => { fires += 1; });
if (DOM.supportsDOMEvents()) {
describe('simple observable interface', () => {
it('should fire callbacks on change', fakeAsync(() => {
var fires = 0;
ObservableWrapper.subscribe(queryList.changes, (_) => { fires += 1; });
queryList.fireCallbacks();
expect(fires).toEqual(0);
queryList.notifyOnChanges();
tick();
queryList.add('one');
expect(fires).toEqual(1);
queryList.fireCallbacks();
expect(fires).toEqual(1);
queryList.notifyOnChanges();
tick();
queryList.fireCallbacks();
expect(fires).toEqual(1);
expect(fires).toEqual(2);
}));
it('should provides query list as an argument', fakeAsync(() => {
var recorded;
ObservableWrapper.subscribe(queryList.changes, (v: any) => { recorded = v; });
queryList.reset(["one"]);
queryList.notifyOnChanges();
tick();
expect(recorded).toBe(queryList);
}));
});
it('should support removing callbacks', () => {
var fires = 0;
var callback = () => fires += 1;
queryList.onChange(callback);
queryList.add('one');
queryList.fireCallbacks();
expect(fires).toEqual(1);
queryList.removeCallback(callback);
queryList.add('two');
queryList.fireCallbacks();
expect(fires).toEqual(1);
});
it('should support removing all callbacks', () => {
var fires = 0;
var callback = () => fires += 1;
queryList.onChange(callback);
queryList.add('one');
queryList.removeAllCallbacks();
queryList.fireCallbacks();
expect(fires).toEqual(0);
});
});
}
});
}
modules/angular2/test/core/forms/integration_spec.ts
+14 -12
View File
@@ -301,24 +301,26 @@ export function main() {
}));
it("should support <select> with a dynamic list of options",
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var t = `<div [ng-form-model]="form">
inject([TestComponentBuilder], fakeAsync((tcb: TestComponentBuilder) => {
var t = `<div [ng-form-model]="form">
<select ng-control="city">
<option *ng-for="#c of data" [value]="c"></option>
</select>
</div>`;
tcb.overrideTemplate(MyComp, t).createAsync(MyComp).then((rootTC) => {
rootTC.debugElement.componentInstance.form =
new ControlGroup({"city": new Control("NYC")});
rootTC.debugElement.componentInstance.data = ['SF', 'NYC'];
rootTC.detectChanges();
var rootTC;
tcb.overrideTemplate(MyComp, t).createAsync(MyComp).then((rtc) => rootTC = rtc);
tick();
var select = rootTC.debugElement.query(By.css('select'));
expect(select.nativeElement.value).toEqual('NYC');
async.done();
});
}));
rootTC.debugElement.componentInstance.form =
new ControlGroup({"city": new Control("NYC")});
rootTC.debugElement.componentInstance.data = ['SF', 'NYC'];
rootTC.detectChanges();
tick();
var select = rootTC.debugElement.query(By.css('select'));
expect(select.nativeElement.value).toEqual('NYC');
})));
it("should support custom value accessors",
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
modules/angular2/test/public_api_spec.ts
+2 -5
View File
@@ -809,13 +809,12 @@ var NG_API = [
'Query.token',
'Query.varBindings',
'QueryList',
'QueryList.add()',
'QueryList.any():dart',
'QueryList.contains():dart',
'QueryList.elementAt():dart',
'QueryList.every():dart',
'QueryList.expand():dart',
'QueryList.fireCallbacks():',
'QueryList.notifyOnChanges():',
'QueryList.first',
'QueryList.firstWhere():dart',
'QueryList.fold():dart',
@@ -828,10 +827,8 @@ var NG_API = [
'QueryList.lastWhere():dart',
'QueryList.length',
'QueryList.map()',
'QueryList.onChange()',
'QueryList.changes',
'QueryList.reduce():dart',
'QueryList.removeAllCallbacks()',
'QueryList.removeCallback()',
'QueryList.reset()',
'QueryList.single',
'QueryList.singleWhere():dart',