Change detection broken after multi page survey (Angular 16)

[GarethPrattCv]

If I create a two (or more) page survey, change detection is left broken on survey completion. In this example, I show a results page on survey completion. The button on that page will not work unless I manually trigger change detection.

Steps:

• Create vanilla angular application
• Add in angular-survey-ui
• Add a new component, "Results"
• Update AppComponent and ResultsComponent:

app.component.html

<survey [model]="surveyModel"></survey>
<app-results *ngIf="complete"></app-results>

app.component.ts

import { ChangeDetectorRef, Component, OnInit } from '@angular/core';
import { SurveyModel } from 'survey-core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html'
})
export class AppComponent implements OnInit {
  public constructor(private readonly changeDetectorRef: ChangeDetectorRef) {}

  public complete = false;

  public surveyModel = new SurveyModel({
    pages: [
      {
        elements: [
          {
            type: 'radiogroup',
            title: 'First question',
            choices: ['Choice 1', 'Choice 2'],
          },
        ],
      },
      {
        elements: [
          {
            type: 'radiogroup',
            title: 'Second question',
            choices: ['Choice 1', 'Choice 2'],
          },
        ],
      },
    ],
  });

  public ngOnInit(): void {
    this.surveyModel.onComplete.add(() => {
      this.complete = true;
      this.changeDetectorRef.detectChanges();
    });
  }
}

results.component.html

<p>This button should show some extra text - but change detection doesn't trigger.</p>
<button (click)="showExtraText = true">Show extra text</button>
<p *ngIf="showExtraText">Extra text</p>

results.component.ts

import { Component } from '@angular/core';

@Component({
selector: 'app-results',
templateUrl: './results.component.html',
})
export class ResultsComponent {
public showExtraText = false;
}

  ```

[dk981234]

Hello,

We'll fix the issue to the next minor update.
For now, you can use this workaround: https://stackblitz.com/edit/angular-pykana?file=src%2Fapp.component.ts

Thanks,
Dmitry
SurveyJS Team

[GarethPrattCv]

Thank you for this, that was quick! Much appreciated. Gareth

…

On Fri, 28 Jul 2023, 20:49 Dmitry, ***@***.***> wrote: Hello, We'll fix the issue to the next minor update. For now, you can use this workaround: https://stackblitz.com/edit/angular-pykana?file=src%2Fapp.component.ts Thanks, Dmitry SurveyJS Team — Reply to this email directly, view it on GitHub <#6619 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AUDYYIFDJ374URV4PGK53F3XSQJTJANCNFSM6AAAAAA23QLEYI> . You are receiving this because you authored the thread.Message ID: ***@***.***>