cargdev/angular
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(common): then and else template might be set to null (#22298)

Browse Source 
PR Close #22298
This commit is contained in:
Victor Berchet 2018-02-18 18:41:43 -08:00
parent c726d1d6d3
commit af6a0563de
3 changed files with 38 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
packages/common/src/directives/ng_if.ts
View File

@ -117,14 +117,15 @@ export class NgIf {
}
@Input()
set ngIfThen(templateRef: TemplateRef<NgIfContext>) {
set ngIfThen(templateRef: TemplateRef<NgIfContext>|null) {
this._thenTemplateRef = templateRef;
this._thenViewRef = null; // clear previous view if any.
this._updateView();
}
@Input()
set ngIfElse(templateRef: TemplateRef<NgIfContext>) {
set ngIfElse(templateRef: TemplateRef<NgIfContext>|null) {
assertTemplate('ngIfElse', templateRef);
this._elseTemplateRef = templateRef;
this._elseViewRef = null; // clear previous view if any.
this._updateView();
@ -163,3 +164,4 @@ export class NgIfContext {
public $implicit: any = null;
public ngIf: any = null;
}

33
packages/common/test/directives/ng_if_spec.ts
View File

@ -138,7 +138,7 @@ import {expect} from '@angular/platform-browser/testing/src/matchers';
expect(fixture.nativeElement).toHaveText('hello');
}));
describe('else', () => {
describe('then/else templates', () => {
it('should support else', async(() => {
const template = '<span *ngIf="booleanCondition; else elseBlock">TRUE</span>' +
'<ng-template #elseBlock>FALSE</ng-template>';
@ -169,6 +169,37 @@ import {expect} from '@angular/platform-browser/testing/src/matchers';
expect(fixture.nativeElement).toHaveText('ELSE');
}));
it('should support removing the then/else templates', () => {
const template = `<span *ngIf="booleanCondition;
then nestedBooleanCondition ? tplRef : null;
else nestedBooleanCondition ? tplRef : null"></span>
<ng-template #tplRef>Template</ng-template>`;
fixture = createTestComponent(template);
const comp = fixture.componentInstance;
// then template
comp.booleanCondition = true;
comp.nestedBooleanCondition = true;
fixture.detectChanges();
expect(fixture.nativeElement).toHaveText('Template');
comp.nestedBooleanCondition = false;
fixture.detectChanges();
expect(fixture.nativeElement).toHaveText('');
// else template
comp.booleanCondition = true;
comp.nestedBooleanCondition = true;
fixture.detectChanges();
expect(fixture.nativeElement).toHaveText('Template');
comp.nestedBooleanCondition = false;
fixture.detectChanges();
expect(fixture.nativeElement).toHaveText('');
});
it('should support dynamic else', async(() => {
const template =
'<span *ngIf="booleanCondition; else nestedBooleanCondition ? b1 : b2">TRUE</span>' +

4
tools/public_api_guard/common/common.d.ts vendored
View File

@ -271,8 +271,8 @@ export declare class NgForOfContext<T> {
/** @stable */
export declare class NgIf {
ngIf: any;
ngIfElse: TemplateRef<NgIfContext>;
ngIfThen: TemplateRef<NgIfContext>;
ngIfElse: TemplateRef<NgIfContext> | null;
ngIfThen: TemplateRef<NgIfContext> | null;
constructor(_viewContainer: ViewContainerRef, templateRef: TemplateRef<NgIfContext>);
}