CODEWITHSUNDEEP
angulartypescript
Cait Sidener
Cait Sidener

Reputation: 21

ERROR TypeError: Cannot convert undefined or null to object ejs-treegrid

In Angular application, I am unable to read from the service I created using [dataSource].

ERROR TypeError: Cannot convert undefined or null to object ERROR TypeError: Cannot read property 'getService' of undefined

component.ts

import { Component, OnInit } from '@angular/core';
import { RailroadAgreementService } from '../../services/railroad-agreement.service';
import { RRA_ID } from '../../models/RRA_ID';

@Component({
  selector: 'app-railroad-agreements',
  templateUrl: './railroad-agreements.component.html',
  styleUrls: ['./railroad-agreements.component.css'],
})

export class RailroadAgreementsComponent implements OnInit {

  public data: RRA_ID[];

  constructor(private railroadAgreementService: RailroadAgreementService) {}

  ngOnInit(): void {
    this.railroadAgreementService.getRRAId().subscribe((data) => {
      this.data = data;
      console.log(this.data);
    })

  }

}

component.html

<ejs-treegrid [dataSource]="data">

</ejs-treegrid>

Upvotes: 1

Views: 580

Answers (1)

Brandon Taylor
Brandon Taylor

Reputation: 34603

If the service method is returning a "cold" observable, it's value will initially be null, and your component is complaining that it can't access a property that it's expecting because it received null instead of an object, array, etc.

This is because the Observable code is running asynchronously.

To counter this, you can force the component to wait until the data property is truthy (not null, undefined, false an empty string, etc) to render:

<ejs-treegrid *ngIf="data" [dataSource]="data"></ejs-treegrid>

Upvotes: 1

Related Questions