fix(change_detection): ChangeDetectorRef reattach should restore original mode

After using ChangeDetectorRef detach, it should keep the ChangeDetector mode so that it is restored after calling reattach.

closes #7078
closes #7080
This commit is contained in:
Alfonso Presa 2016-02-15 00:02:11 +01:00 committed by Tobias Bosch
parent 791153c93c
commit 773c34900f
2 changed files with 52 additions and 3 deletions

View File

@ -80,7 +80,13 @@ export abstract class EmbeddedViewRef<C> extends ViewRef {
}
export class ViewRef_<C> implements EmbeddedViewRef<C>, ChangeDetectorRef {
constructor(private _view: AppView<C>) { this._view = _view; }
/** @internal */
_originalMode: ChangeDetectionStrategy;
constructor(private _view: AppView<C>) {
this._view = _view;
this._originalMode = this._view.cdMode;
}
get internalView(): AppView<C> { return this._view; }
@ -95,7 +101,7 @@ export class ViewRef_<C> implements EmbeddedViewRef<C>, ChangeDetectorRef {
detectChanges(): void { this._view.detectChanges(false); }
checkNoChanges(): void { this._view.detectChanges(true); }
reattach(): void {
this._view.cdMode = ChangeDetectionStrategy.CheckAlways;
this._view.cdMode = this._originalMode;
this.markForCheck();
}

View File

@ -1032,6 +1032,43 @@ export function main() {
expect(renderLog.log).toEqual([]);
}));
it('Reattaches', fakeAsync(() => {
var ctx = createCompFixture('<comp-with-ref></comp-with-ref>');
var cmp: CompWithRef = queryDirs(ctx.debugElement, CompWithRef)[0];
cmp.value = 'hello';
cmp.changeDetectorRef.detach();
ctx.detectChanges();
expect(renderLog.log).toEqual([]);
cmp.changeDetectorRef.reattach();
ctx.detectChanges();
expect(renderLog.log).toEqual(['{{hello}}']);
}));
it('Reattaches in the original cd mode', fakeAsync(() => {
var ctx = createCompFixture('<push-cmp></push-cmp>');
var cmp: PushComp = queryDirs(ctx.debugElement, PushComp)[0];
cmp.changeDetectorRef.detach();
cmp.changeDetectorRef.reattach();
// renderCount should NOT be incremented with each CD as CD mode should be resetted to
// on-push
ctx.detectChanges();
expect(cmp.renderCount).toBeGreaterThan(0);
var count = cmp.renderCount;
ctx.detectChanges();
expect(cmp.renderCount).toBe(count);
}));
});
describe('multi directive order', () => {
@ -1192,7 +1229,7 @@ class CompWithRef {
@Component({
selector: 'push-cmp',
template: '<div (event)="noop()" emitterDirective></div>{{value}}',
template: '<div (event)="noop()" emitterDirective></div>{{value}}{{renderIncrement}}',
host: {'(event)': 'noop()'},
directives: ALL_DIRECTIVES,
pipes: ALL_PIPES,
@ -1200,6 +1237,12 @@ class CompWithRef {
})
class PushComp {
@Input() public value: any;
public renderCount: any = 0;
get renderIncrement() {
this.renderCount++;
return '';
}
constructor(public changeDetectorRef: ChangeDetectorRef) {}