protractor typescript pageobject property undefined

Hi I'm getting the following error when I use POM in protractor typescript with angular cli "Cannot read property 'sendUsername' of undefined". I'm new to typescript, please suggest me how to resolve this issue.

error

Failed: Cannot read property 'sendUsername' of undefined

app.e2e-spec.ts

import { PatientInquiryPrototypePage } from './patiq-common.po';
import { LoginAdmin } from './patiq-login.po';

describe('patient-inquiry-prototype App', () => {
let page: PatientInquiryPrototypePage;
let loginAdmin: LoginAdmin;

beforeEach(() => {
page = new PatientInquiryPrototypePage();
});

it('Launch the Test URL', () => {
  page.navigateTo();
});

it('Login as Administrator', () => {

  loginAdmin.sendUsername('PILabAdmin');
  loginAdmin.sendPassword('password$123');
  loginAdmin.openHostSystem();
  loginAdmin.selectHostSystem();
  loginAdmin.openHostRole();
  loginAdmin.selectHostRole();

  });
  });

patiq-login.po.ts

import { browser, by, element, protractor, ExpectedConditions, $, $$ } from 'protractor';

export class LoginAdmin {

sendUsername(Username: string) {
    return element(by.css('[formcontrolname="username"]')).sendKeys(Username);
}

sendPassword(Password: string) {
    return element(by.css('[formcontrolname="password"]')).sendKeys(Password);
}

openHostSystem() {
    return element(by.css('[formcontrolname="hostSystem"]')).click();
}

selectHostSystem() {
    return element(by.css('[class="mat-option"]')).get(0).click();
}

openHostRole() {
    return element(by.css('[formcontrolname="hostRole"]')).click();
}

selectHostRole() {
    return element(by.css('[class="mat-option"]')).get(6).click();
}
}