fix(list-view): Add support for default item template

NativeScript · Feb 15, 2019 · 4061cc7 · 4061cc7
1 parent 726bdd6
commit 4061cc7
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 7 deletions.
diff --git a/nativescript-angular/directives/templated-items-comp.ts b/nativescript-angular/directives/templated-items-comp.ts
@@ -155,11 +155,6 @@ export abstract class TemplatedItemsComponent implements DoCheck, OnDestroy, Aft
 
             viewRef = args.view[NG_VIEW];
 
-            // No ng-template is setup, continue with 'defaultTemplate' 
-            if (viewRef) {
-                return;
-            }
-
             // Getting angular view from original element (in cases when ProxyViewContainer
             // is used NativeScript internally wraps it in a StackLayout)
             if (!viewRef && args.view instanceof LayoutBase && args.view.getChildrenCount() > 0) {
@@ -169,6 +164,11 @@ export abstract class TemplatedItemsComponent implements DoCheck, OnDestroy, Aft
             if (!viewRef && isLogEnabled()) {
                 listViewError(`ViewReference not found for item ${index}. View recycling is not working`);
             }
+
+            // No ng-template is setup, continue with 'defaultTemplate'
+            if (!viewRef) {
+                return;
+            }
         }
 
         if (!viewRef) {

diff --git a/tests/app/tests/list-view-tests.ts b/tests/app/tests/list-view-tests.ts
@@ -1,7 +1,8 @@
 import { assert } from "./test-config";
-import { Component, Input } from "@angular/core";
+import { Component, Input, ViewChild } from "@angular/core";
 import { ComponentFixture, async } from "@angular/core/testing";
 import { nsTestBedAfterEach, nsTestBedBeforeEach, nsTestBedRender } from "nativescript-angular/testing";
+import { ListViewComponent } from "nativescript-angular/directives";
 // import trace = require("trace");
 // trace.setCategories("ns-list-view, " + trace.categories.Navigation);
 // trace.enable();
@@ -76,11 +77,34 @@ export class TestListViewSelectorComponent {
     constructor() { testTemplates = { first: 0, second: 0 }; }
 }
 
+@Component({
+    selector: "list-view-default-item-template",
+    template: `
+    <GridLayout>
+        <ListView #listView [items]="myItems"></ListView>
+    </GridLayout>
+    `
+})
+export class TestDefaultItemTemplateComponent {
+    public myItems: Array<DataItem>;
+    constructor () {
+        this.myItems = new Array<DataItem>();
+        for (let i = 0; i < 100; i++) {
+            this.myItems.push(new DataItem(i, "Name " + i));
+        }
+    }
+    @ViewChild("listView") listViewElement: ListViewComponent;
+    onScrollListViewTo() { 
+        this.listViewElement.nativeElement.scrollToIndex(100);
+    }
+}
+
 describe("ListView-tests", () => {
     beforeEach(nsTestBedBeforeEach([
         TestListViewComponent,
         TestListViewSelectorComponent,
-        ItemTemplateComponent
+        ItemTemplateComponent,
+        TestDefaultItemTemplateComponent
     ]));
     afterEach(nsTestBedAfterEach(false));
 
@@ -98,4 +122,12 @@ describe("ListView-tests", () => {
             assert.deepEqual(testTemplates, { first: 2, second: 1 });
         });
     }));
+
+    it("'defaultTemplate' does not throw when list-view is scrolled", async(() => {
+        nsTestBedRender(TestDefaultItemTemplateComponent)
+            .then((fixture: ComponentFixture<TestDefaultItemTemplateComponent>) => {
+                const component = fixture.componentRef.instance;
+                assert.doesNotThrow(component.onScrollListViewTo.bind(component));
+            });
+    }));
 });