Element implicitly has an 'any' type because index expression is not of type in html template

Yes, this one again. But I think it is different because I'm getting this in my html template. This is angular 14.2, typescript 4.6.4.

I have this angular code:

export class MyInfo {
  public name = '';
  public street = '';
}

export class Everyone {
  public people: { [index: string]: MyInfo } = this.getEveryone();
}

people would look like this:

{
  '1': { name: 'Homer', street: 'Evergreen Terrace'},
  '34': { name: 'Rod', street: 'Maple'}
}

Since this is going to come from a database where records are added and removed all the time, I can't specify the primary keys that are going to come back, in this case 1 and 34. Using keyof type in the typescript is no problem. It's in the html template that I have problems. The html looks something like this:

<div *ngFor='let character of differentPeople'>
  <p *ngIf="people[character.id]['street'] === character['street']; else alone>
    {{ people[character.id]['name'] }} lives on the same street as character['name'];
  </p>
  <ng-template #alone><p>You live alone</p></ng-template>
</div>

Forgive the hastily written simple example. The idea is that I have an array of characters and I loop through all of them. Each character has an id that is a string. I want to use the character's id to reference the object in people that has that key. I've defined the keys as strings in the typescript for both people and characters.

I can use let a = this.people[this.characters['id'] as keyof typeof this.people]['street']; just fine in the typescript, but when the template is compiled I get Element implicitly has an 'any' type because index expression is not of type 'string'.

Any ideas of how to fix this in the html? I've got another way I can go with this, but I'd prefer not to.

Thanks!