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:
parent
791153c93c
commit
773c34900f
|
@ -80,7 +80,13 @@ export abstract class EmbeddedViewRef<C> extends ViewRef {
|
||||||
}
|
}
|
||||||
|
|
||||||
export class ViewRef_<C> implements EmbeddedViewRef<C>, ChangeDetectorRef {
|
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; }
|
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); }
|
detectChanges(): void { this._view.detectChanges(false); }
|
||||||
checkNoChanges(): void { this._view.detectChanges(true); }
|
checkNoChanges(): void { this._view.detectChanges(true); }
|
||||||
reattach(): void {
|
reattach(): void {
|
||||||
this._view.cdMode = ChangeDetectionStrategy.CheckAlways;
|
this._view.cdMode = this._originalMode;
|
||||||
this.markForCheck();
|
this.markForCheck();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1032,6 +1032,43 @@ export function main() {
|
||||||
|
|
||||||
expect(renderLog.log).toEqual([]);
|
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', () => {
|
describe('multi directive order', () => {
|
||||||
|
@ -1192,7 +1229,7 @@ class CompWithRef {
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'push-cmp',
|
selector: 'push-cmp',
|
||||||
template: '<div (event)="noop()" emitterDirective></div>{{value}}',
|
template: '<div (event)="noop()" emitterDirective></div>{{value}}{{renderIncrement}}',
|
||||||
host: {'(event)': 'noop()'},
|
host: {'(event)': 'noop()'},
|
||||||
directives: ALL_DIRECTIVES,
|
directives: ALL_DIRECTIVES,
|
||||||
pipes: ALL_PIPES,
|
pipes: ALL_PIPES,
|
||||||
|
@ -1200,6 +1237,12 @@ class CompWithRef {
|
||||||
})
|
})
|
||||||
class PushComp {
|
class PushComp {
|
||||||
@Input() public value: any;
|
@Input() public value: any;
|
||||||
|
public renderCount: any = 0;
|
||||||
|
|
||||||
|
get renderIncrement() {
|
||||||
|
this.renderCount++;
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
|
||||||
constructor(public changeDetectorRef: ChangeDetectorRef) {}
|
constructor(public changeDetectorRef: ChangeDetectorRef) {}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue