javascript - แสดงกล่องโต้ตอบแบบโมดอลจาก HttpInterceptor

@Injectable()
export class MyInterceptor implements HttpInterceptor
{
    intercept(req : HttpRequest<any>, next : HttpHandler) : Observable<HttpEvent<any>>
    {
//show a modal dialog to hold the request until user respond/close the dialog
        if(ShowModalDialog())
        {
            return next.handle(req);
        }
        else
        {
//route to login
        }
    }
}

ฉันได้พยายามแสดงไดอะล็อกของ Angular Material แต่มันไม่บล็อกคำขอและมันยังคงดำเนินการบรรทัดต่อไป

ฉันจำเป็นต้องรู้วิธีแสดงกล่องโต้ตอบแบบโมดอลจากอินเตอร์เซปเตอร์เมื่อมีการตอบกลับข้อผิดพลาดของคำขอ แสดงตัวเลือกบางอย่างให้ผู้ใช้ และดำเนินการต่อหลังจากที่ปิดกล่องโต้ตอบแล้ว

เป็นไปได้ไหมที่จะหยุด/ระงับคำขอด้วยการสนทนาเช่นนี้?

คำตอบ #1

คุณสามารถทำสิ่งนี้ได้ด้วยกล่องโต้ตอบของ Angular Material:

@Injectable()
export class MyInterceptor implements HttpInterceptor {
  constructor(private dialog: MatDialog, private router: Router) {}
  
  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    if(ShowModalDialog()) {
      return this.dialog.open(DialogModalComponent).afterClosed().pipe(
        concatMap(() => next.handle(req))
      );
    } else {
      return next.handle(req);
    }
  }
}