diff --git a/components/core/services/popup.service.ts b/components/core/services/popup.service.ts
index 2e13e286..aa247402 100644
--- a/components/core/services/popup.service.ts
+++ b/components/core/services/popup.service.ts
@@ -1,18 +1,15 @@
-import { Injectable, Injector, ViewContainerRef, ComponentRef } from '@angular/core';
+import { Injectable, Injector, ComponentRef } from '@angular/core';
 import { Overlay, OverlayConfig, OverlayRef, GlobalPositionStrategy } from '@angular/cdk/overlay';
 import { ComponentPortal } from '@angular/cdk/portal';
 
 @Injectable()
 export class PopupService {
-  static viewContainerRef: ViewContainerRef = null;
   static overlay: Overlay = null;
   static overlayRef: OverlayRef = null;
 
   constructor(
     public _overlay: Overlay,
-    public _viewContainerRef: ViewContainerRef
   ) {
-    PopupService.viewContainerRef = this._viewContainerRef;
     PopupService.overlay = this._overlay;
   }
 
@@ -30,7 +27,7 @@ export class PopupService {
       PopupService.overlayRef.dispose();
     });
 
-    return PopupService.overlayRef.attach(new ComponentPortal(component, PopupService.viewContainerRef, childInjector));
+    return PopupService.overlayRef.attach(new ComponentPortal(component, undefined, childInjector));
   }
 
   static hidePopup(): void {
diff --git a/components/modal/demo/alert.ts b/components/modal/demo/alert.ts
index 3cec51a1..97f165da 100644
--- a/components/modal/demo/alert.ts
+++ b/components/modal/demo/alert.ts
@@ -19,7 +19,7 @@ import { Modal, Toast } from 'ng-zorro-antd-mobile';
       <WhiteSpace></WhiteSpace>
     </WingBlank>
   `,
-  providers: [Toast, Modal]
+  providers: [Toast]
 })
 export class DemoModalAlertComponent {
   constructor(private _modal: Modal, private _toast: Toast) {}
diff --git a/components/modal/demo/basic.ts b/components/modal/demo/basic.ts
index 9b53d4c4..a529eda9 100644
--- a/components/modal/demo/basic.ts
+++ b/components/modal/demo/basic.ts
@@ -56,7 +56,7 @@ import { Modal, Toast } from 'ng-zorro-antd-mobile';
       }
     `
   ],
-  providers: [Toast, Modal]
+  providers: [Toast]
 })
 export class DemoModalBasicComponent {
   state = {
diff --git a/components/modal/demo/operation.ts b/components/modal/demo/operation.ts
index 9fb4318b..949817db 100644
--- a/components/modal/demo/operation.ts
+++ b/components/modal/demo/operation.ts
@@ -10,7 +10,7 @@ import { Modal, Toast } from 'ng-zorro-antd-mobile';
       <WhiteSpace></WhiteSpace>
     </WingBlank>
   `,
-  providers: [Toast, Modal]
+  providers: [Toast]
 })
 export class DemoModalOperationComponent {
   constructor(private _modal: Modal, private _toast: Toast) {}
diff --git a/components/modal/demo/prompt.ts b/components/modal/demo/prompt.ts
index 6c090a2e..45c9aeca 100644
--- a/components/modal/demo/prompt.ts
+++ b/components/modal/demo/prompt.ts
@@ -18,7 +18,7 @@ import { Modal, Toast } from 'ng-zorro-antd-mobile';
       <WhiteSpace></WhiteSpace>
     </WingBlank>
   `,
-  providers: [Toast, Modal]
+  providers: [Toast]
 })
 export class DemoModalPromptComponent {
   constructor(private _modal: Modal, private _toast: Toast) {}
diff --git a/components/modal/modal.service.ts b/components/modal/modal.service.ts
index 70341b37..ec1f27c7 100644
--- a/components/modal/modal.service.ts
+++ b/components/modal/modal.service.ts
@@ -7,6 +7,9 @@ import {
 import { ModalServiceComponent } from './modal.component';
 import { BaseOptions, ModalOptions, AlertOptions, Action } from './modal-options.provider';
 import { PopupService } from '../core/core.module';
+@Injectable({
+  providedIn: 'root'
+})
 @Injectable()
 export class Modal extends PopupService {
   static modalRef: ComponentRef<ModalServiceComponent> = null;