I am having troubles implementing ion-refresher

Hello i want to implement ionic refresh in one of my app pages, i am using newsapi calls for getting news and i want to refresh page to add new articles as this happens only if u exit the app and reopen it.
this is my api request .ts file

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Injectable({
  providedIn: 'root'
})
export class HackingnewsService {
  API_KEY = 'ce6b266f4d914e0395633c717d019471';
  constructor(private httpClient: HttpClient) { }
  getNews(){
    return this.httpClient.get(`https://newsapi.org/v2/top-headlines?sources=techcrunch&apiKey=${this.API_KEY}`);
   }
}

this is my homepage.ts file

import { Component } from '@angular/core';
import {HackingnewsService} from '../hackingnews.service'

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {

  slidesOptions = {
    slidesPerView: 2
  };

  articles;
  constructor(private newsService: HackingnewsService) {}
  ionViewDidEnter(){
    this.newsService.getNews().subscribe((data)=>{
      console.log(data);
      this.articles=data['articles'];
    });
  }
}

and this is my ion refresher component

    <ion-refresher slot="fixed" (ionRefresh)="load($event)">
        <ion-refresher-content></ion-refresher-content>
      </ion-refresher>