角4：如果有多个具有相同选择器的组件，如何根据某些条件仅加载一个组件？

Question

主要组成部分：

@Component({
    selector: 'app-root',
    template: '<app-report></app-report>'
})

组件1：

@Component({
    selector: 'app-report',
    templateUrl: './trip.report.html'
})

组件2：

@Component({
    selector: 'app-report',
    templateUrl: './user.report.html'
})

角度4中是否有任何方式可以根据某种条件根据某种条件将哪个组件（组件1或2）加载到“主组件”中？

Answer 1

没有办法做到这一点。对于在内部声明并导入到单个组件中的所有组件和指令，选择器必须唯一NgModule。

如果您拥有代码，则不要创建冲突的选择器。

如果导入的第三方模块具有选择器
冲突的组件，则可以将使用非冲突选择器的冲突组件包装到另一个组件中，并将其添加到其自己的模块中。然后，您可以指定@NgModule({imports: [...]})应在哪个组件中使用。

那你就可以用 *ngIf

<conflicting-component *ngIf="foo"></conflicting-component>
<de-conflicted-wrapper *ngIf="!foo"></de-conflicted-wrapper>