Use Async pipe like rxDemo example and show error: Cannot read property 'length' of null

use async pipe in the package version 2.1.3 show error my project.

[ ] bug report => code :

rows: Observable<ContactBook[]>;

  constructor(private cgService: ContactBookService) {
  }

  ngOnInit(): void {
    this.rows = this.cgService.getContactBooks();
  }

template :

<swui-datatable
          class="material"
          [rows]="rows | async"
          [columnMode]="'force'"
          [headerHeight]="50"
          [footerHeight]="50"
          [rowHeight]="'auto'"
          [limit]="10">
    <swui-datatable-column name="name">
      <template let-column="column" swui-datatable-header-template>
         {{column.name}}
      </template>
      <template let-value="value" swui-datatable-cell-template>
       <strong>{{value}}</strong>
      </template>
    </swui-datatable-column>
    <swui-datatable-column name="type">
      <template let-column="column" swui-datatable-header-template>
         {{column.name}}
      </template>
      <template let-value="value" swui-datatable-cell-template>
        <strong>{{'CONTACT_GROUP.'+value | translate}}</strong>
      </template>
    </swui-datatable-column>
  </swui-datatable>

error :

 core.umd.js:3004 EXCEPTION: Uncaught (in promise): Error: Error in ./DatatableComponent class DatatableComponent - inline template:15:8 caused by: Cannot read property 'length' of null
TypeError: Cannot read property 'length' of null
    at DatatableComponent.get [as allRowsSelected] (http://localhost:3000/node_modules/angular2-data-table/release/index.js:2174:54)
    at _View_DatatableComponent1.detectChangesInternal (/Angular2DataTableModule/DatatableComponent/component.ngfactory.js:330:42)
    at _View_DatatableComponent1.AppView.detectChanges (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:9305:18)
    at _View_DatatableComponent1.DebugAppView.detectChanges (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:9410:48)
    at _View_DatatableComponent0.AppView.detectContentChildrenChanges (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:9323:23)
    at _View_DatatableComponent0.detectChangesInternal (/Angular2DataTableModule/DatatableComponent/component.ngfactory.js:192:8)
    at _View_DatatableComponent0.AppView.detectChanges (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:9305:18)
    at _View_DatatableComponent0.DebugAppView.detectChanges (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:9410:48)
    at _View_ContactGroup0.AppView.detectViewChildrenChanges (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:9331:23)
    at _View_ContactGroup0.detectChangesInternal (/PageModule/ContactGroup/component.ngfactory.js:203:8)ErrorHandler.handleError @ core.umd.js:3004next @ core.umd.js:6654schedulerFn @ core.umd.js:5952SafeSubscriber.__tryOrUnsub @ Subscriber.ts:238SafeSubscriber.next @ Subscriber.ts:190Subscriber._next @ Subscriber.ts:135Subscriber.next @ Subscriber.ts:95Subject.next @ Subject.ts:61EventEmitter.emit @ core.umd.js:5944NgZone.triggerError @ core.umd.js:6248onHandleError @ core.umd.js:6227ZoneDelegate.handleError @ zone.js:236Zone.runGuarded @ zone.js:131_loop_1 @ zone.js:412drainMicroTaskQueue @ zone.js:421ZoneTask.invoke @ zone.js:339
core.umd.js:3009 ORIGINAL STACKTRACE:ErrorHandler.handleError @ core.umd.js:3009next @ core.umd.js:6654schedulerFn @ core.umd.js:5952SafeSubscriber.__tryOrUnsub @ Subscriber.ts:238SafeSubscriber.next @ Subscriber.ts:190Subscriber._next @ Subscriber.ts:135Subscriber.next @ Subscriber.ts:95Subject.next @ Subject.ts:61EventEmitter.emit @ core.umd.js:5944NgZone.triggerError @ core.umd.js:6248onHandleError @ core.umd.js:6227ZoneDelegate.handleError @ zone.js:236Zone.runGuarded @ zone.js:131_loop_1 @ zone.js:412drainMicroTaskQueue @ zone.js:421ZoneTask.invoke @ zone.js:339
core.umd.js:3010 Error: Uncaught (in promise): Error: Error in ./DatatableComponent class DatatableComponent - inline template:15:8 caused by: Cannot read property 'length' of null
TypeError: Cannot read property 'length' of null
    at DatatableComponent.get [as allRowsSelected] (datatable.component.ts:653)
    at _View_DatatableComponent1.detectChangesInternal (component.ngfactory.js:330)
    at _View_DatatableComponent1.AppView.detectChanges (core.umd.js:9305)
    at _View_DatatableComponent1.DebugAppView.detectChanges (core.umd.js:9410)
    at _View_DatatableComponent0.AppView.detectContentChildrenChanges (core.umd.js:9323)
    at _View_DatatableComponent0.detectChangesInternal (component.ngfactory.js:192)
    at _View_DatatableComponent0.AppView.detectChanges (core.umd.js:9305)
    at _View_DatatableComponent0.DebugAppView.detectChanges (core.umd.js:9410)
    at _View_ContactGroup0.AppView.detectViewChildrenChanges (core.umd.js:9331)
    at _View_ContactGroup0.detectChangesInternal (component.ngfactory.js:203)
    at resolvePromise (zone.js:468)
    at zone.js:445
    at ZoneDelegate.invoke (zone.js:232)
    at Object.onInvoke (core.umd.js:6206)
    at ZoneDelegate.invoke (zone.js:231)
    at Zone.run (zone.js:114)
    at zone.js:502
    at ZoneDelegate.invokeTask (zone.js:265)
    at Object.onInvokeTask (core.umd.js:6197)
    at ZoneDelegate.invokeTask (zone.js:264)ErrorHandler.handleError @ core.umd.js:3010next @ core.umd.js:6654schedulerFn @ core.umd.js:5952SafeSubscriber.__tryOrUnsub @ Subscriber.ts:238SafeSubscriber.next @ Subscriber.ts:190Subscriber._next @ Subscriber.ts:135Subscriber.next @ Subscriber.ts:95Subject.next @ Subject.ts:61EventEmitter.emit @ core.umd.js:5944NgZone.triggerError @ core.umd.js:6248onHandleError @ core.umd.js:6227ZoneDelegate.handleError @ zone.js:236Zone.runGuarded @ zone.js:131_loop_1 @ zone.js:412drainMicroTaskQueue @ zone.js:421ZoneTask.invoke @ zone.js:339
zone.js:388 Unhandled Promise rejection: Error in ./DatatableComponent class DatatableComponent - inline template:15:8 caused by: Cannot read property 'length' of null ; Zone: angular ; Task: Promise.then ; Value: ViewWrappedError {_nativeError: Error: Error in ./DatatableComponent class DatatableComponent - inline template:15:8 caused by: Cann…, originalError: TypeError: Cannot read property 'length' of null
    at DatatableComponent.get [as allRowsSelected] …, context: DebugContext} TypeError: Cannot read property 'length' of null
    at DatatableComponent.get [as allRowsSelected] (http://localhost:3000/node_modules/angular2-data-table/release/index.js:2174:54)
    at _View_DatatableComponent1.detectChangesInternal (/Angular2DataTableModule/DatatableComponent/component.ngfactory.js:330:42)
    at _View_DatatableComponent1.AppView.detectChanges (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:9305:18)
    at _View_DatatableComponent1.DebugAppView.detectChanges (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:9410:48)
    at _View_DatatableComponent0.AppView.detectContentChildrenChanges (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:9323:23)
    at _View_DatatableComponent0.detectChangesInternal (/Angular2DataTableModule/DatatableComponent/component.ngfactory.js:192:8)
    at _View_DatatableComponent0.AppView.detectChanges (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:9305:18)
    at _View_DatatableComponent0.DebugAppView.detectChanges (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:9410:48)
    at _View_ContactGroup0.AppView.detectViewChildrenChanges (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:9331:23)
    at _View_ContactGroup0.detectChangesInternal (/PageModule/ContactGroup/component.ngfactory.js:203:8)consoleError @ zone.js:388_loop_1 @ zone.js:417drainMicroTaskQueue @ zone.js:421ZoneTask.invoke @ zone.js:339
zone.js:390 Error: Uncaught (in promise): Error: Error in ./DatatableComponent class DatatableComponent - inline template:15:8 caused by: Cannot read property 'length' of null(…)

* **Table version:**2.1.3

* **Angular version:** 2.2.1

* **Browser:** [ Chrome XX | Firefox XX ]

* **Language:** [TypeScript 2.0.10 ]

[Alex-Tsyganok]

@h4mit you can use next workaround with startWith() :

rows: Observable<ContactBook[]>;

  constructor(private cgService: ContactBookService) {
  }

  ngOnInit(): void {
    this.rows = this.cgService.getContactBooks().startWith(new Array<ContactBook>());
  }

[insidewhy]

Why is this issue closed? It’s still an existing bug and it’s really annoying. It’s not good behaviour, I’m sure I’m not the only one to lose hours due to this silly bug and to find the only solution buried away in a github issue is a bit frustrating.