fix(NgFor): allow default templates with ng-for-template

pkozlowski-opensource · pkozlowski-opensource · commit 2d0c8f1b0e1a · 2015-11-06T19:26:02.000Z
Closes #5161
diff --git a/modules/angular2/src/common/directives/ng_for.ts b/modules/angular2/src/common/directives/ng_for.ts
@@ -73,7 +73,11 @@ export class NgFor implements DoCheck {
     }
   }
 
-  set ngForTemplate(value: TemplateRef) { this._templateRef = value; }
+  set ngForTemplate(value: TemplateRef) {
+    if (isPresent(value)) {
+      this._templateRef = value;
+    }
+  }
 
   doCheck() {
     if (isPresent(this._differ)) {
diff --git a/modules/angular2/test/common/directives/ng_for_spec.ts b/modules/angular2/test/common/directives/ng_for_spec.ts
@@ -329,6 +329,39 @@ export function main() {
              });
        }));
 
+    it('should use a default template if a custom one is null',
+       inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
+         tcb.overrideTemplate(TestComponent, `<ul><template ng-for #item [ng-for-of]="items"
+         [ng-for-template]="contentTpl" #i="index">{{i}}: {{item}};</template></ul>`)
+             .overrideTemplate(ComponentUsingTestComponent, '<test-cmp></test-cmp>')
+             .createAsync(ComponentUsingTestComponent)
+             .then((fixture) => {
+               var testComponent = fixture.debugElement.componentViewChildren[0];
+               testComponent.componentInstance.items = ['a', 'b', 'c'];
+               fixture.detectChanges();
+               expect(testComponent.nativeElement).toHaveText('0: a;1: b;2: c;');
+
+               async.done();
+             });
+       }));
+
+    it('should use a custom template when both default and a custom one are present',
+       inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
+         tcb.overrideTemplate(TestComponent, `<ul><template ng-for #item [ng-for-of]="items"
+         [ng-for-template]="contentTpl" #i="index">{{i}}=> {{item}};</template></ul>`)
+             .overrideTemplate(
+                 ComponentUsingTestComponent,
+                 '<test-cmp><li template="#item #i=index">{{i}}: {{item}};</li></test-cmp>')
+             .createAsync(ComponentUsingTestComponent)
+             .then((fixture) => {
+               var testComponent = fixture.debugElement.componentViewChildren[0];
+               testComponent.componentInstance.items = ['a', 'b', 'c'];
+               fixture.detectChanges();
+               expect(testComponent.nativeElement).toHaveText('0: a;1: b;2: c;');
+
+               async.done();
+             });
+       }));
   });
 }
 

Original file line number	Diff line number	Diff line change
`@@ -73,7 +73,11 @@ export class NgFor implements DoCheck {`
`73`	`73`	`}`
`74`	`74`	`}`
`75`	`75`
`76`		`- set ngForTemplate(value: TemplateRef) { this._templateRef = value; }`
	`76`	`+ set ngForTemplate(value: TemplateRef) {`
	`77`	`+ if (isPresent(value)) {`
	`78`	`+ this._templateRef = value;`
	`79`	`+ }`
	`80`	`+ }`
`77`	`81`
`78`	`82`	`doCheck() {`
`79`	`83`	`if (isPresent(this._differ)) {`