Angular amTimeAgo not refreshing

Question

I am trying to refresh amTimeAgo every time I call my function "resetDate" but it is not working. It is logging a correct new time in the console but the time does not refresh on the page.

    import { NgModule, Component, OnInit } from '@angular/core';
    import {BrowserModule} from '@angular/platform-browser';
    import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
    import { MomentModule } from 'angular2-moment';
    import { HttpClient } from '@angular/common/http';

    @Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
})

    export class AppComponent {
       getSystemsStatus () {
         this.httpClient.get<serverResponse>('http://127.0.0.1:5000/systemsStatus').subscribe(data => {
        if (JSON.stringify(this.systemStatusText) === JSON.stringify(data.systemStatusText)) {

        }
        else {
          this.systemStatus=data.systemStatus;
          this.systemStatusText=data.systemStatusText;
          let callTimeagoComponent = new TimeagoComponent();
          callTimeagoComponent.resetDate();
        }
        });
    };
  }
}

    @Component({
          selector: 'lastUpdated',
          template: '<div id="time1"><time>Last updated: {{myDate | amTimeAgo}}</time>'
        })

        export class TimeagoComponent{
          myDate = new Date();
          resetDate() {
            this.myDate = new Date();
          }
        }


    @NgModule({
      imports: [
        BrowserModule,
        MomentModule
      ],
      declarations: [ TimeagoComponent ],
      bootstrap: [ TimeagoComponent ]
    })
    class TimeagoModule {}

    platformBrowserDynamic().bootstrapModule(TimeagoModule);

What am I missing? I am just trying to compare the results of two items returned from the HTTP call, and if they are different, update the items and refresh the time since last updated.