Question

我需要从网站上删除当前运行的Angular应用程序，我试图通过删除HTML应用程序节点来实现这一点。但是我最近发现了这样做的副作用，即没有删除Angular安装的一些回调。

什么是拆除Angular 4应用程序的正确方法？

我正在使用的当前方法似乎不正确：

function tryRemoveApplicationNode() {
  const currentApplicationNode = document.getElementsByTagName('ngk-app')[0];
  if (currentApplicationNode) {
    const parent = currentApplicationNode.parentNode;
    parent.removeChild(currentApplicationNode);
  }
}

Answer 1

首先，您需要@angularclass/hmr包：

npm install @angularclass/hmr

这会让你的生活更轻松。

您应该在destroy模块的AppModule调用中致电dispose上的hot，之后使用createNewHosts @angularclass/hmr方法包。您可以尝试将此作为hmrBootstrap函数：

import {createNewHosts} from '@angularclass/hmr';
import {ApplicationRef, NgModuleRef} from '@angular/core';

export const hmrBootStrap: Function = async (): Promise<void> => {
    module['hot'].accept();
    const ngModule: NgModuleRef<AppModule> = await bootstrap();
    module['hot'].dispose(() => {
        const makeVisible: () => void = createNewHosts(
            ngModule.injector.get(ApplicationRef).components.map(
                c => c.location.nativeElement
            )
        );
        ngModule.destroy();
        makeVisible();
    });
};

并且正常bootstrap方法定义如下：

export const bootstrap: any = (): Promise<NgModuleRef<AppModule>> => {
    return platformBrowserDynamic().bootstrapModule<AppModule>(AppModule);
};

作为（部分）main.ts你可以拥有：

if (module.hot) {
    hmrBootStrap();
} else {
    bootstrap();
}

Answer 2

正确拆卸应用程序所需的唯一内容是：

//save the NgModuleRef for later
let applicationModule = await platformBrowserDynamic().bootstrapModule(AppModule);

//when it's time:
applicationModule.destroy();

我的答案基于@PierreDuc显示的方向，但不涉及任何类型的HMR。把它放在这里只是为了记录。

Angular 4 - 如何正确拆除应用程序？

2 个答案: