Hi all I have the following page code:

import { Component, OnInit } from '@angular/core';
import {LicencesService} from '../../services/databaseServices/licences.service';

@Component({
  selector: 'app-licences',
  templateUrl: './licences.page.html',
  styleUrls: ['./licences.page.scss'],
})
export class LicencesPage implements OnInit {

  public licencesData: [];

  constructor(
    protected licenceService = LicencesService
  ) { }

  async ngOnInit() {
    await this.licenceService.getLicences('testing');
  }

}

However as you can see in the picture, my web storm does not register that it is a available method. I am wondering how to fix this?

I am unable to call any method inside this page. But in other pages I am able to and this error does not exits so I am not sure what I am doing wrong.
If I click alt click on the method I get taken to the method as well

Error Image

>Solution :

In this row:

constructor(
  protected licenceService = LicencesService
) { }

You are assigning the class LicensesService to the property licenceService. You are assigning literally the class, not an instance. In JavaScript, as well as in TypeScript, classes are first-class citizens, thus you can assign them to variables.

Probably, you meant to use Dependency Injection to fill the value of the variable, thus you have to specify the type and let Angular create the instance, not assign the property:

constructor(
  protected licenceService: LicencesService
) { }