setInterval() does not set data without refreshing the page in angular component

Question

here is my angular component -

export class UserListComponent implements OnInit, OnDestroy {
  private _subscriptions: Subscription;
  private _users: User[] = [];
  private _clickableUser: boolean = true;

  constructor(
    private route: ActivatedRoute,
  ) { }

  ngOnInit() {
    const source = interval(1000);
    const users = this.route.snapshot.data['users'] as IUserInterface[];

    this._subscriptions = source.subscribe(() => this._users = users.map(user => new User(user)))

  }

  ngOnDestroy() {
    this._subscriptions.unsubscribe();
  }

i get the data, but the interval does not set it without refreshing.

@BrianSmith the interval(1000) is from rxjs, so yes its setInterval() — daniel45, Jun 27 '21 at 21:23
@BrianSmith i am trying to set data without refreshing the page — daniel45, Jun 27 '21 at 21:23
I am not sure of the rest of your app, but it look like you should be using an @Input and pass the 'users' value into this component and not passing via route data. If you can reproduce this in a stackblitz, it will give a better picture. — Brian Smith, Jun 27 '21 at 21:34

score 0 · Answer 1 · answered Jun 27 '21 at 21:30

0

ngOnInit() is only called once, when a component is first created. This means that your active route is being read only once, which also means that your users array is always the same one.

I'm guessing you are trying to update your component each time the route data gets updated. For that, you need to subscribe to this.route.data (notice I didn't include snapshot). It will look something like this:

this._subscriptions = this.route.data.subscribe(data => this._users = data['users'].map(user => new User(user));

answered Jun 27 '21 at 21:30

Shy Agam

1,285
1
13
37

where can i put the interval? – daniel45 Jun 27 '21 at 22:07
@daniel45 you should subscribe to route changes. See https://stackoverflow.com/a/33548895/5819227 – MarksASP Jun 27 '21 at 22:24
Why do you need the interval in the first place? – Shy Agam Jun 29 '21 at 05:17

setInterval() does not set data without refreshing the page in angular component

1 Answers1