要解决Angular HttpInterceptor缓存未触发变更检测的问题，可以使用NgZone来手动触发变更检测。以下是一个示例解决方法：

1. 创建一个名为CacheInterceptor的HttpInterceptor：

import { Injectable, NgZone } from '@angular/core';
import { HttpInterceptor, HttpRequest, HttpHandler, HttpResponse } from '@angular/common/http';

@Injectable()
export class CacheInterceptor implements HttpInterceptor {
  constructor(private ngZone: NgZone) {}

  intercept(req: HttpRequest, next: HttpHandler) {
    // 检查请求是否启用了缓存
    if (req.headers.has('Cache-Control') && req.headers.get('Cache-Control') === 'no-cache') {
      // 发送请求
      return next.handle(req).pipe(
        // 在响应返回后手动触发变更检测
        tap((event) => {
          if (event instanceof HttpResponse) {
            this.ngZone.run(() => {});
          }
        })
      );
    }
    // 对于其他请求，直接通过
    return next.handle(req);
  }
}

2. 将CacheInterceptor添加到应用程序的提供者中，可以在app.module.ts文件中完成：

import { NgModule } from '@angular/core';
import { HTTP_INTERCEPTORS } from '@angular/common/http';
import { CacheInterceptor } from './cache.interceptor';

@NgModule({
  // ...
  providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: CacheInterceptor,
      multi: true
    }
  ],
  // ...
})
export class AppModule { }

通过以上解决方法，可以在Angular的HttpInterceptor中使用NgZone来手动触发变更检测，确保缓存的数据能够在页面上正确显示。