Consume (Call) WebService with Angular in Typescript with .Net Core

Actually, I am using .net core with angular, when I call asmx api in starting , means with constructor its working fine, but when I call it through function after click on button from html side, then it’s showing error , that get function not defined.

import { Component, Inject } from '@angular/core';
import { Http } from '@angular/http';

@Component({
    selector: 'fetchdata',
    templateUrl: './fetchdata.component.html'
})

export class FetchDataComponent {
    
    public candi: candidates[];
constructor(http: Http, @Inject('BASE_URL') baseUrl: string) {
        http.get('http://placementing.com/placementing.asmx/candidates').subscribe(result => {
            this.candi = result.json() as candidates[];
        },
}

public getcandi() {
alert("just to check");
return http.get('http://placementing.com/placementing.asmx/candidates').subscribe(result => {
            this.candi = result.json() as candidates[];
        }, error => console.error(error));
}
}
interface candidates {
    FirstName: string;
    EmpCode: string;
}

<input type="button" title="james click here" (click)="getcandi()" />
<table class='table' *ngIf="candi">
    <thead>
        <tr>
            <th>Date</th>
            <th>Temp. (C)</th>
           
        </tr>
    </thead>
    <tbody>
        <tr *ngFor="let c of candi">
            <td>{{ c.FirstName }}</td>
            <td>{{ c.EmpCode }}</td>
         
        </tr>
    </tbody>
</table>