Why does a type error occur in the template of an Angular component if all types are specified?

Question

JavaScript

Good day! We are transferring the project from Angular 6 to version 12. Encountered linter errors

Error: path/to/component/some.component.html:982:41 - error TS2339: Property 'blocked' does not exist on type 'unknown'.
[isDisabled]="object.blocked"

Error: path/to/component/some.component.html:1162:110 - error TS2345: Argument of type 'unknown' is not assignable to parameter of type 'SomeStatus'.
<button class="btn" (click)="someMethod(object, object.courses[0], $event)">

In the second error, the linter doesn't like the 1st parameter. In both errors , object is the same object that describes the results of the user, the type for it is set by the interface, the interface itself is described in a separate file and imported into the component. The first error can be solved if you access the property through the object['blocked'] brackets , but it's not convenient to write in html, I would like to leave it as it is, I don't know what to do with the second one.

Can you tell me why these errors occur and how to fix them?

Answer 1

In my case the error was caused by the SlicePipe added to the loop. Solved the problem by writing