Angular 6自定义库没有ComponentFactoryResolver的提供程序 [英] Angular 6 custom lib No provider for ComponentFactoryResolver

查看:216
本文介绍了Angular 6自定义库没有ComponentFactoryResolver的提供程序的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我从NG4-> NG6重写库(使用angular-cli 6).这个lib改变了dynamicli的角度分量,所以我使用ComponentFactoryResolver,在这里我陷入了困境.当我将ComponentFactoryResolver添加到构造函数中时:

I rewriting library from NG4 -> NG6 (using angular-cli 6). This lib change dynamicli angular components so I using ComponentFactoryResolver and here I got stuck. When I add ComponentFactoryResolver to constructor:

constructor(
    private componentFactoryResolver: ComponentFactoryResolver
) {}

并在目标应用程序中构建lib(成功)(我从本地文件中将lib添加到package.json中)我有此错误:

and build lib (with success) in target app (I add my lib in package.json from local file) I have this error:

StaticInjectorError(AppModule)[MyLibComponent-> ComponentFactoryResolver]: 
  StaticInjectorError(Platform: core)[MyLibComponent-> ComponentFactoryResolver]: 
    NullInjectorError: No provider for ComponentFactoryResolver!
    at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (core.js:979)
    at resolveToken (core.js:1232)
    at tryResolveToken (core.js:1182)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (core.js:1077)
    at resolveToken (core.js:1232)
    at tryResolveToken (core.js:1182)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (core.js:1077)
    at resolveNgModuleDep (core.js:9238)
    at NgModuleRef_.push../node_modules/@angular/core/fesm5/core.js.NgModuleRef_.get (core.js:9919)

在没有ComponentFactoryResolver的情况下,其他功能正常工作

Without ComponentFactoryResolver other things work correct

完整组件:

import { Component, ComponentFactoryResolver, AfterContentInit, ViewChild, Inject, Input, InjectionToken } from '@angular/core';

import { AbHostDirective } from './../directives/ab-host.directive';

export const AB_COMPONENTS = new InjectionToken('AB_COMPONENTS');

@Component({
  selector: 'lib-ab',
  template: `<ng-template lib-ab-host></ng-template>`,
  styles: []
})

export class MyLibComponent implements AfterContentInit {
  @ViewChild(AbHostDirective) abHost: AbHostDirective;
  @Input() globalConfiguration: any;
  @Input() domain = '';

  constructor(
    @Inject(AB_COMPONENTS) private $configuredComponents: any,
    private componentFactoryResolver: ComponentFactoryResolver
  ) {}

  ngAfterContentInit() {
    const currentConfiguration = this.$configuredComponents[this.domain];

    if (!currentConfiguration) {
        console.error('No component for: ', + this.domain);
        return;
    }

    const randomIndex      = Math.floor(Math.random() * currentConfiguration.length);
    const componentFactory = this.componentFactoryResolver.resolveComponentFactory(currentConfiguration[randomIndex]);
    const viewContainerRef = this.abHost.viewContainerRef;
    viewContainerRef.clear();
    const componentRef = viewContainerRef.createComponent(componentFactory);
    const instance     = <any>componentRef.instance;
    instance.globalConfiguration     = this.globalConfiguration;
  }
}

推荐答案

我遇到了同样的问题.这打勾解决了我的问题:

I had the same issue. This ticked solved my problem:

https://github.com/angular/angular/issues/20598

尝试将其添加到您的angular.json文件:

Try adding this to your angular.json file:

"build": {
    "options": {
        "preserveSymlinks": true,
    }
}

这篇关于Angular 6自定义库没有ComponentFactoryResolver的提供程序的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆