使用动态组件加载时Angular中的循环Depepdency

时间:2018-05-21 12:31:31

标签: angular shared-libraries circular-dependency

我正在构建一个通用组件共享库,它允许我在angular中嵌套组件。 例如:卡片内的卡片或网格内的网格,或者说网格内的卡片等。 一般情况下,ui-component 中的ui-component 由于这将是动态组件,因此我为其编写了component-manager-service以从后端获取此组件。 它还使用component-manager-helper.service来确定每个component的详细信息 因此,我有一种循环依赖,其中:

component --> component-manager-service --> component
component-->component-manager-service-->component-manager-helper.service-->component

我在这里得到了通常的 WARNING in Circular dependency detected: 错误。

代码示例: 组件:

export class component {
    id: string;
    relationalElements: Map<string, Map<string, component>>;
    public getRelationalElements(str: string): Map<string, component> {
        return this.relationalElements.get(str);
    }
    public getId(): string {
        return this.id;
    }
    static fromJSON(json: componentIntf): component {
        let comp = Object.create(component.prototype);
        return Object.assign(comp, json, {
            relationalElements: ComponentMgrService.getMap(json.relationalElements),
            attributes: ComponentMgrService.getAttributesMap(json.attributes) //reference to component manager-service
        });
    }
}

组件管理器服务:

@Injectable()
export class ComponentMgrService {
    constructor() { }
    public static getMap(json: any): Map<string, Map<string, component>> {
        let mprtyp = Object.create(Map.prototype);
        let mapobj = Object.assign(mprtyp, json);
        let data: any[] = json;
        let m: Map<string, Map<string, component>> = new Map<string, Map<string, component>>();// reference to component
        for (var i in data) {
            var item = data[i];
            m.set(i + "", this.getInnerMap(i, item));
        }
        return m
    }
}

成分,它的管理器辅助服务

@Injectable()
export class CompMgrHlprService {

  constructor() { }
  public static getPele(i:string,json:any):component{
    if(i==="REL"){
      console.log("ComponentMgrService>json is:");
      console.log(json);

  return componentRel.fromJSON(json);//    m.set(i,ComponentMgrService.getPele(i,item));
  }else if(i==="FIELD") {

    return FormField.fromJSON(json);
  }else if(i==="COMP") {

    return component.fromJSON(json);
  }return null;
  }

}

我该如何解决?

0 个答案:

没有答案