I have an object called WeeklyDriver with various keys. My goal is to iterate over an array of objects containing WeeklyDriver instances (referred to as drivers in my code), and then loop through a specific set of keys belonging to the WeeklyDriver object:
public ovrKeys:Array<keyof WeeklyDriver> = [
'SunOvrVal',
'MonOvrVal',
'TueOvrVal',
'WedOvrVal',
'ThuOvrVal',
'FriOvrVal',
'SatOvrVal'
];
Below is how I declared the drivers variable:
@Input() drivers:Array<WeeklyDriver> = [];
Please note that each key mentioned earlier holds a value of type number. However, I seem to encounter an issue when trying to bind these keys to number inputs, possibly due to not specifying their type as numbers using TypeScript.
My objective is to loop through the array of WeeklyDriver objects, and then cycle through those specified keys to bind them to number input fields:
<tr *ngFor="let driver of drivers">
<td *ngFor="let ovrKey of ovrKeys">
<input
type="number"
min="0"
step="1"
[(ngModel)]="driver[ovrKey]"
placeholder="New value"
/>
</td>
</tr>
Unfortunately, I keep encountering the following error message:
Type 'any' is not assignable to type 'never'The error seems to be linked specifically to this line:
[(ngModel)]="driver[ovrKey]"
I attempted to resolve it by adding as keyof WeeklyDriver in the html like so:
driver[ovrKey as keyof WeeklyDriver]].
I also experimented with
*ngFor="let (ovrKey as keyof WeeklyDriver) of ovrKeys"Property 'ovrKey' does not exist on type 'WeeklyDriverTableComponent'. Did you mean 'ovrKeys'?Can someone point out what might be wrong in my approach? Any suggestions or guidance would be really appreciated. Thank you!