diff --git a/src/assets/wise5/classroomMonitor/classroomMonitorComponents/nodeProgress/node-progress-view/node-progress-view.component.ts b/src/assets/wise5/classroomMonitor/classroomMonitorComponents/nodeProgress/node-progress-view/node-progress-view.component.ts
index 8befdf7d0b6..750a95e4598 100644
--- a/src/assets/wise5/classroomMonitor/classroomMonitorComponents/nodeProgress/node-progress-view/node-progress-view.component.ts
+++ b/src/assets/wise5/classroomMonitor/classroomMonitorComponents/nodeProgress/node-progress-view/node-progress-view.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import { ChangeDetectorRef, Component, OnInit } from '@angular/core';
 import { TeacherProjectService } from '../../../../services/teacherProjectService';
 import { TeacherDataService } from '../../../../services/teacherDataService';
 import { Subscription } from 'rxjs';
@@ -20,6 +20,7 @@ export class NodeProgressViewComponent implements OnInit {
   private subscriptions: Subscription = new Subscription();
 
   constructor(
+    private changeDetectorRef: ChangeDetectorRef,
     private configService: ConfigService,
     private dialog: MatDialog,
     private projectService: TeacherProjectService,
@@ -40,6 +41,10 @@ export class NodeProgressViewComponent implements OnInit {
     }
   }
 
+  ngAfterViewChecked(): void {
+    this.changeDetectorRef.detectChanges();
+  }
+
   private subscribeToCurrentNodeChanged(): void {
     this.subscriptions.add(
       this.dataService.currentNodeChanged$.subscribe(({ currentNode }) => {