CODEWITHSUNDEEP
angularangular-routingangular-formshttp-parameters
user8743396
user8743396

Reputation:

Error in console but displays in browser

I have a problem in my angular app that says ERROR TypeError: Cannot read property 'name' of undefined but the projects.name is displaying. How can i get rid of the error in the console.log. The data contains an object.

ngOnInit() {
    this.route.params 
      .subscribe((params: Params) => { 
      this.id = +params['id']; 
      this.projectsService = this.injector.get(ProjectsService);
      this.projectsService.getProject(this.id)
      .subscribe(
          (data:any) => {
            this.projects = data;
            console.log(data);

          },
          error => {
            alert("ERROR");
          })
      });  
}

Upvotes: 2

Views: 52

Answers (2)

Dmitry Grinko
Dmitry Grinko

Reputation: 15214

You can use {{projects?.name}} or you should initialize your projects... best practice is to use the interface and the class for your projects.

Upvotes: 1

Pankaj Parkar
Pankaj Parkar

Reputation: 136144

Seems like you directly used projects.name and projects is being retrieved by ajax. This code fails because it tries to projects.name binding on initial change detection run.

In such cases Use Safe Navigation / Elvis operator

{{projects?.name}}

Upvotes: 1

Related Questions