Cannot read property 'push' of undefined(…) in angular2 : <p>this is the error saying <strong><em>" cannot read property 'push' of undefined "</em></strong> when using the code below</p>

<pre><code>  let deal = new Deal(  5, 'afaf', 'dafa',5,23 ) 
  this.publicDeals.push( deal )   // gives a error saying Cannot read property 'push' of undefined(…)
</code></pre>

<p>The whole is shown below</p>

<pre><code>export class Deal { 
  constructor(
    public id: number,
    public name: string,
    public  description: string,
    public originalPrice: number,
    public salePrice: number
      ) { }    
}
</code></pre>

<p>In another component, </p>

<pre><code>import { Component, OnInit } from '@angular/core'; 
import { Deal } from '../deal';
import { DealService } from '../deal.service';

@Component({
  selector: 'public-deals',
  templateUrl: 'public-deals.component.html',
  styleUrls: ['public-deals.component.css']
})

export class PublicDealsComponent implements OnInit {
  publicDeals: Deal[];

  constructor(
    private dealService: DealService) {
  }

  ngOnInit(): void {    
      let deal = new Deal(  5, 'afaf', 'dafa',5,23 ) 
      this.publicDeals.push( deal )   // gives a error saying Cannot read property 'push' of undefined(…)

  }

  purchase(item){
    alert("You bought the: " + item.name);
  }
}
</code></pre>
