Question

当我要将Angular应用程序集成到AngularJS应用程序中时，我已按照有关如何将Angular模块降级到AngularJS的说明进行操作。我的Angular应用程序包含一个带有html模板的组件，该模板包含一些简单的文本：

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'app';
}

在我的app.module.ts中，我有以下内容：

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';

@NgModule({
 declarations: [
  AppComponent
 ],
 imports: [
  BrowserModule
 ],
 providers: [],
 bootstrap: [],
 entryComponents: [
  AppComponent],
})

export class AppModule {
  public static ModuleName = 'app';
  constructor() {}
  ngDoBootstrap() {}
}

我的main.ts包含以下内容：

import { enableProdMode, StaticProvider } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { downgradeModule } from '@angular/upgrade/static';
import { AppModule } from './app/app.module';
import { environment } from './environments/environment';

if (environment.production) {
 enableProdMode();
}

declare var angular: any;

const bootstrapFn = (extraProviders: StaticProvider[]) => {
 const platformRef = platformBrowserDynamic(extraProviders);
 return platformRef.bootstrapModule(AppModule);
};

 const downgradedModule = downgradeModule(bootstrapFn);

 angular.module('ui-components', [
   downgradedModule
 ]);

在AngularJS部分中，我有一个简单的html，其中插入了Angular组件的名称：

<div ng-controller="toastController as ctrl">
  <p>Hello world!</p>
</div>

<app-root></app-root>

我不了解的事情是如何将此模块传递给用JavaScript编写的AngularJS应用。只是将downgradedModule添加到我的AngularJS模块的依赖项中是行不通的，并会导致错误。有人可以帮我这个问题并解释一下吗？

在JavaScript中将Angular模块降级为AngularJS

0 个答案: