I've come across some code that I need to refactor, but I'm struggling to fully grasp how to go about it. In my TypeScript file, I have defined the keys that I want to include in an object:
keysInclude = {
property1: 'Property 1',
property2: 'Property 2',
property3: 'Property 3',
}
myObject = {
property1: 'some string',
property2: 'some string',
property3: 'some string',
property4: 'some property I don't want to show',
property5: 'some property I don't want to show'
}
Then in my template, this part of the code is implemented
<div *ngFor = " let keyValuePair of keysInclude | keyvalue; let i=index">
<span>{{keyValuePair.value}}</span>
<span>{{myObject[keyValuePair.key]}}</span>
<span></span>
</div>
I'm having difficulty in defining the type for my keysInclude. Ideally, I'd like to add types without making extensive changes, but I'm unsure of how to proceed. The type of myObject will always be defined and will always contain the same properties as the keys inside the keysInclude object. I've attempted to use Record and the KeyValue interface of Angular, but I keep encountering errors stating that my Element implicitly has an 'any' type because expressions of type {} can't be used to index myObject.