ERROR TypeError: Can not read property 'push' of null

1

I'm trying to push to a list and the following error is occurring:

ERROR TypeError: Cannot read property 'push' of null
    at ProjectService.webpackJsonp.../../../../../src/app/projects/shared/project.service.ts.ProjectService.createItem (project.service.ts:34)
    at ProjectFormComponent.webpackJsonp.../../../../../src/app/projects/project-form/project-form.component.ts.ProjectFormComponent.createItem (project-form.component.ts:20)
    at Object.eval [as handleEvent] (ProjectFormComponent.html:8)
    at handleEvent (core.es5.js:12047)
    at callWithDebugContext (core.es5.js:13508)
    at Object.debugHandleEvent [as handleEvent] (core.es5.js:13096)
    at dispatchEvent (core.es5.js:8659)
    at core.es5.js:9270
    at HTMLButtonElement.<anonymous> (platform-browser.es5.js:2668)
    at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:424)

The Service code:

import { Injectable } from '@angular/core';
// import { AngularFire, FirebaseListObservable, FirebaseObjectObservable, AngularFireDatabase } from "angularfire2";
import { AngularFireDatabase, FirebaseListObservable, FirebaseObjectObservable } from 'angularfire2/database';
import { Project } from './project'

@Injectable()
export class ProjectService {

  private basePath: string = '/projects';

  items: FirebaseListObservable<Project[]> = null; //  list of objects
  item: FirebaseObjectObservable<Project> = null; //   single object

  constructor(private db: AngularFireDatabase) {}

  // Return an observable list with optional query
  // You will usually call this from OnInit in a component
  getItemsList(query={}): FirebaseListObservable<Project[]> {
    this.items = this.db.list('/projects', {
      query: query
    });
    return this.items
  }

  // Return a single observable item
  getItem(key: string): FirebaseObjectObservable<Project> {
    const itemPath =  '${this.basePath}/${key}';
    this.item = this.db.object(itemPath)
    return this.item
  }

  // Create a bramd new item
  createItem(item: Project): void  {
    this.items.push(item)
      .catch(error => this.handleError(error))
  }


  // Update an exisiting item
  updateItem(key: string, value: any): void {
    this.items.update(key, value)
      .catch(error => this.handleError(error))
  }

  // Deletes a single item
  deleteItem(key: string): void {
      this.items.remove(key)
        .catch(error => this.handleError(error))
  }

  // Deletes the entire list of items
  deleteAll(): void {
      this.items.remove()
        .catch(error => this.handleError(error))
  }


  // Default error handling for all actions
  private handleError(error) {
    console.log(error)
  }


}

I've tried to get null out of the statement, but it generates another error as undefined.

    
asked by anonymous 11.07.2017 / 17:01

2 answers

4

The array items is being initialized with null , so an exception is raised when .push() is called. It is necessary to initialize items with an array empty, therefore items will be defined:

items: FirebaseListObservable<Project[]> = [];
    
11.07.2017 / 17:34
2

I was able to resolve this, I added in the builder of the service the initialization of the list this.items = db.list('/projects');

constructor(private db: AngularFireDatabase) {
        this.items = db.list('/projects');
   }
    
12.07.2017 / 02:45