0

In ngOnInit() I have a subscription on a Subject, which sends new data when I get a new response in my service from the EventSource:

this._orderService.onNewOrderLoaded$
  .subscribe(order => {
    this.orders.push(order)
    this.orders.sort((a, b) => b.id - a.id)
    this.orders = this.orders.slice()
    this.notify()
  })

this._orderService.openSSEConnection()

In my template I have a simple table, that displays orders:

<tr *ngFor="let order of orders">
...
</tr>

But component doesn't rerender when in subscription in ngOnInit() I get new orders and change orders' model using .slice(). So I detect changes manualy using this._ref.detectChanges(). It is the first question: How can I rerender component without detectChanges() when I get a new order in subscription?

And the seconds problem is that when I use detectChanges() and rerender table of orders, (click) method doesn't update model of new order too. (click) of <td></td> calls function:

viewOrder(order: Order) {
    this.selectedOrder = { ...order }
    this.isInfoModalOpened = true
}

This function changes isInfoModalOpened and selectedOrder so modal component can be displayed:

<app-modal-component *ngIf="isInfoModalOpened" [order]="selectedOrder">

But it doesn't work too, so or I need to call detectChanges() manualy or I need to click on some element, that will cause changes detection.

2
  • Does this answer your question? Angular 2 change detection - push data into array Commented Jun 6, 2021 at 11:19
  • Your components are not onPush right..? I have never ever needed to manually do detectChanges..there is really nothing wrong with change detection in Angular 😁 Commented Jun 6, 2021 at 13:01

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.