Question

我尝试在angular2中使用循环相关组件。到目前为止开箱即用的是递归组件（在angular1中不能很好地工作）：

@Component({
    selector: 'ace-view',
    template:
`<ace-view *ngFor="let SubView of SubViews" [view]="SubView"></ace-view>`,
    directives:[
        AceViewComponent
    ]
})
export class AceViewComponent {
...
}

上面显示的组件将自身用于子视图，它按预期工作。

但是，我遇到组件A需要组件B而组件B需要组件A的情况：

@Component({
    selector: 'ace-A',
    template:
`<ace-B *ngIf="whatever"></ace-B>`,
    directives:[
        AceB
    ]
})
export class AceA {}


@Component({
    selector: 'ace-B',
    template:
`<ace-A *ngIf="whatever"></ace-A>`,
    directives:[
        AceA
    ]
})
export class AceB {}

然后问题是，AceA尚未定义，当用于AceA的指令时。更糟糕的是，AceA和AceB可能存在于不同的文件中。

这种复发的正确解决方案是什么？
我可以稍后在运行时向指令数组添加指令吗？
我在哪里可以找到@component装饰器的源代码及其实现（以便我可以看到它的作用并尝试在运行时模仿它）？

Answer 1

您可以将@Component({ selector: 'ace-A', template: ` <ace-B *ngIf="whatever"></ace-B> `, directives:[ forwardRef(() => AceB) ] }) export class AceA {} (...)用于此用例。事实上，ES6课程不支持吊装。

.column

角2圆形组件

1 个答案: