在混合应用程序中使用ng1控件中的ng2组件时出错

时间:2017-03-25 12:19:01

标签: angularjs angular

我正在关注this guide将ng1.x应用升级到ng2应用。 我能够引导混合应用程序,但是当我尝试编写新的ng2组件然后从ng1控件使用它时,我收到以下错误:

#logo{
         margin: auto;
    }

main.ts:

zone.js:571 Error: Uncaught (in promise): Error: [$injector:modulerr] http://errors.angularjs.org/1.5.8/$injector/modulerr?p0=%24%24UpgradeModule…s%2F%40angular%2Fcore%2Fbundles%2Fcore.umd.js%3A4152%3A37)%20%5Bangular%5D
Error: [$injector:modulerr] http://errors.angularjs.org/1.5.8/$injector/modulerr?p0=%24%24UpgradeModule…s%2F%40angular%2Fcore%2Fbundles%2Fcore.umd.js%3A4152%3A37)%20%5Bangular%5D
    at :3000/vendor/angular/angular.min.js:6:412 [angular]
    at :3000/vendor/angular/angular.min.js:40:222 [angular]
    at q (angular.js:321) [angular]
    at g (angular.js:4601) [angular]
    at cb (angular.js:4523) [angular]
    at c (angular.js:1758) [angular]
    at Bc (angular.js:1779) [angular]
    at eval (upgrade_module.ts:236) [angular]
    at Object.onInvoke (ng_zone.ts:261) [angular]
    at Zone.run (zone.js:125) [<root> => angular]
    at NgZone.run (ng_zone.ts:132) [<root>]
    at UpgradeModule.bootstrap (upgrade_module.ts:236) [<root>]
    at :3000/vendor/angular/angular.min.js:6:412 [angular]
    at :3000/vendor/angular/angular.min.js:40:222 [angular]
    at q (angular.js:321) [angular]
    at g (angular.js:4601) [angular]
    at cb (angular.js:4523) [angular]
    at c (angular.js:1758) [angular]
    at Bc (angular.js:1779) [angular]
    at eval (upgrade_module.ts:236) [angular]
    at Object.onInvoke (ng_zone.ts:261) [angular]
    at Zone.run (zone.js:125) [<root> => angular]
    at NgZone.run (ng_zone.ts:132) [<root>]
    at UpgradeModule.bootstrap (upgrade_module.ts:236) [<root>]
    at resolvePromise (zone.js:712) [<root>]
    at :3000/node_modules/zone.js/dist/zone.js:763:17 [<root>]
    at Zone.runTask (zone.js:165) [<root> => <root>]
    at drainMicroTaskQueue (zone.js:593) [<root>]
    at XMLHttpRequest.ZoneTask.invoke (zone.js:464) [<root>]

app.module.ts:

declare var angular: angular.IAngularStatic;
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { UpgradeModule, downgradeComponent } from '@angular/upgrade/static';
import { AppModule } from './app.module';
import {TestComp} from "./ng2/test-comp/test-comp.component";
platformBrowserDynamic().bootstrapModule(AppModule).then(platformRef => {
    const upgrade = platformRef.injector.get(UpgradeModule) as UpgradeModule;

    upgrade.bootstrap(document.documentElement, ['myApp']);

});

测试comp.component.ts:

@NgModule({
    imports: [
        BrowserModule,
        UpgradeModule,
    ],
    declarations: [
        TestComp,
    ],
    entryComponents: [
        TestComp,
        ]
})

0 个答案:

没有答案