bug/docs?: router resources and reloading ability is conflicting with types and docs
- Dominant language
- TypeScript
- Stars
- 101k
- Forks
- 27.5k
- Avg merge
- 1d 19h
- Merged PRs (30d)
- 288
Description
### Which @angular/* package(s) are the source of the bug?
router
### Is this a regression?
No
### Description
The router resource preview docs say that [router resources can be reloaded like so](https://next.angular.dev/guide/routing/data-fetching-with-resources#reloading-resources-without-renavigation):
```ts
export class UserProfile {
user = input.required();
private userResource = inject(ActivatedRoute).resources?.['user'];
refreshUser() {
// Reloads only this specific resource without renavigating the route
this.userResource?.reload();
}
}
```
However, the typing exposed for `resources` on activated routes (`type ResourceResult = Record>`) works such that you have to cast the `resources[string]` for activated route access to consumers from `Resource` to `ResourceRef`
```ts
export class UserProfile
user = input.required();
private userResource = inject(ActivatedRoute).resources?.['user'];
refreshUser() {
// Reloads only this specific resource without renavigating the route
(this.userResource as ResourceRef | undefined)?.reload();
}
}
```
I cannot tell if this is a docs issue or a code type issue. Perhaps it is the later? It seems that internally from what I see in the tests and some of the router resource code, that the inner functionality and test utils are derived from `export function routerResource(source: Resource): Resource & {reload(): boolean}`. I would assume then that the `ActivatedRoute` typing for `resources` would be be `type ResourceResult = Record & {reload(): boolean}>`.
### Please provide a link to a minimal reproduction of the bug
https://stackblitz.com/edit/stackblitz-starters-wvxzxeg9?file=src%2Fcomponents.ts
### Please provide the exception or error you saw
```true
Property 'reload' does not exist on type 'Resource'.(2339)
```
### Please provide the environment you discovered this bug in (run `ng version`)
```true
Angular CLI : 22.2.0-next.6
Angular : 22.2.0-next.7
Node.js : 22.22.3
Package Manager : npm 10.8.2
Operating System : linux x64
┌───────────────────────────┬───────────────────┬───────────────────┐
│ Package │ Installed Version │ Requested Version │
├───────────────────────────┼───────────────────┼───────────────────┤
│ @angular/build │ 22.2.0-next.6 │ ^22.2.0-next.6 │
│ @angular/cli │ 22.2.0-next.6 │ ^22.2.0-next.6 │
│ @angular/common │ 22.2.0-next.7 │ ^22.2.0-next.7 │
│ @angular/compiler │ 22.2.0-next.7 │ ^22.2.0-next.7 │
│ @angular/compiler-cli │ 22.2.0-next.7 │ ^22.2.0-next.7 │
│ @angular/core │ 22.2.0-next.7 │ ^22.2.0-next.7 │
│ @angular/forms │ 22.2.0-next.7 │ ^22.2.0-next.7 │
│ @angular/platform-browser │ 22.2.0-next.7 │ ^22.2.0-next.7 │
│ @angular/router │ 22.2.0-next.7 │ ^22.2.0-next.7 │
│ rxjs │ 7.8.2 │ ^7.8.1 │
│ typescript │ 6.0.3 │ ^6.0.3 │
```
### Anything else?
@atscott I saw you have some active drafts and an open PR for changes going into router resources, but as of writing out this issue, I didn't see a docs change or type change that addressed this.
PS this stuff is really cool, thank you for router resources.
Contributor guide
Research direction
Start with the linked router resources guide and the StackBlitz reproduction, then inspect ActivatedRoute.resources and the routerResource tests and implementation mentioned in the report. Confirm whether the public type or the documentation is inconsistent, and verify that the reported reload example type-checks without a cast when the issue is resolved.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- angular, typescript
- Domain
- frontend, web-dev
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Active
- Clarity
- Mostly clear
- Newbie friendliness
- 52/100