Question

我正在运行混合角度1应用程序和角度2应用程序。我创建了一个组件 ActivateAccount 。我正在运行这个应用程序。降级组件时出现控制台错误。的 Cannot read property 'resolveComponentFactory' of undefined <activate-account class="ng-scope">

我搜索了与此错误有关但我什么也没找到。

我指的是Using Angular Components from AngularJS Code

app.module.js

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { UpgradeModule, downgradeComponent } from '@angular/upgrade/static';
import { HttpModule }    from '@angular/http';

import { ActivateAccountComponent } from '/thinkshop/widgets2/thinkshopapplication/activateaccount/activateaccount.ts';


@NgModule({
  imports:  [ 
                BrowserModule,
                UpgradeModule ,
                HttpModule
            ],

  declarations: [
                 ActivateAccountComponent
                    ],
    entryComponents: [
                    ActivateAccountComponent
                       ]
})

export class AppModule {
    constructor(private upgrade: UpgradeModule) { }

    ngDoBootstrap() {

    var app= angular.module('IdeolveActivateAccount', ['ngMaterial', 'jlareau.bowser', 'validation.match', 'ngDialog', 'ngMessages']);


        app.controller("ActivateAccountApp", loadActivateAccountApp);
        angular.module('IdeolveActivateAccount').directive('activateAccount', downgradeComponent({ component: ActivateAccountComponent }));

        app.component("ideolveformcomponent",{
            bindings:{
                showideolvelink: '<'
            },
            controller: 'ActivateAccountApp',
            templateUrl: '/thinkshop/widgets2/thinkshopapplication/login/template/landingdisplay.html'
        });

        this.upgrade.bootstrap(document.body, ['IdeolveActivateAccount']);
    }
}

activateaccount.ts

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


@Component({
    selector: 'activate-account',
    template: '<div class="ActivateAccountContainer marginlefttwentypx margintoptwentypx marginrighttwentypx marginbottomtwentypx heighthundredpercent"></div>'     
})

export class ActivateAccountComponent {
    constructor() {}    
}

我想我错过了一些东西。我已经检查了上面链接中给出的教程的所有代码，但是我收到了控制台错误。

Answer 1

经过漫长的discussion后，以下步骤有所帮助：

<强> app.module.ts

providers: [
    {provide: 'CLIENT_ID', useValue: CLIENT_ID},
    {provide: 'APP_NAME', useValue: APP_NAME},
    {provide: 'AUTH_TOKEN', useValue: AUTH_TOKEN},
    {provide: 'CAN_EDIT', useValue: CAN_EDIT},
    //{provide: Http, useValue: Http}, <-- unneccesary, when import HttpModule
    ActivateAccountService // <-- provide service in module, not component
]

启用-account.service.ts

从构造函数中删除 URLSearchParams ，因为它不是可注入的对象。而不是这个，你应该使用@angular/router模块

降级角度2分量时获取错误

1 个答案: