<a> tags in interpolated text not working

#1

I’m working on an Ionic/Angular/Electron motd app. Message text retrieved from a server for display may contain links or other HTML. My question is how to get the links in interpolated message text treated as active/functional links instead of as dead text that does nothing?

Minimal HTML with message interpolation:

<ion-card *ngFor="let motd of motds">
  <ion-card-content>
    <ion-item>
      {{motd.message}}
    </ion-item>
  </ion-card-content>
</ion-card>

Motd defs:

interface IMotd {
  messageId: number,
  title: string,
  message: string
}

motds: IMotd[] = [];    // Data retrieved from server in ngOnInit()

// Faked up test data from ngOnInit()
this.motds = [
  {messageId:1, title:"Title 1", message:"Message 1 <a href=\"https://www.google.com\">Google</a>"}
];