Help with typescript on ionic4

The this.ref.push in not working, can anyone please help?
Any help will be appreciated

export class ProfilePage implements OnInit {

data: Observable<any>;
ref: AngularFireList;

months = [
{value: 0, name: ‘January’},
{value: 1, name: ‘February’},
{value: 2, name: ‘March’},
{value: 3, name: ‘April’},
{value: 4, name: ‘May’},
{value: 5, name: ‘June’},
{value: 6, name: ‘July’},
{value: 7, name: ‘August’},
{value: 8, name: ‘September’},
{value: 9, name: ‘October’},
{value: 10, name: ‘November’},
{value: 11, name: ‘December’},

transaction = {
value: 0,
expense: false,
month: 0,

@ViewChild(‘valueBarsCanvas’, {static: false}) valueBarCanvas;
valueBarsChart: any;
chartData: any; /**suppose to be null */

constructor(private afs: AngularFirestore, private user: UserService, public NavCtrl: NavController, private db: AngularFireDatabase, private toastCtrl: ToastController, public toastcontroller: ToastController) {

async ionViewDidLoad() {
this.ref = this.db.list(‘transactions’, ref => ref.orderByChild(‘month’));
this.ref.valueChanges().subscribe(result => {
if (this.chartData) {
else {

async addTransaction() {
this.ref.push(this.transaction).then(() => {
this.transaction = {
value: 0,
expense: false,
month: 0,

The console shows:

ERROR Error: Uncaught (in promise): TypeError: Cannot read property ‘push’ of undefined

While you wait for better answers, rewrite this as if async/await didn’t exist, eliminate all use of any and give types to all parameters and return values of all methods. This exercise should expose what is happening and hopefully help you avoid similar pitfalls in the future.