Angular2 多个组件错误

Question

我刚刚将我的ng2应用程序从rc.4升级到了rc.5。 我的app.html文件中的内容如下：

<div>
    <switch-app [account]="cache.accountInfo" [app]="cache.current_app">
    <router-outlet></router-outlet>
</div>

我在app.module.ts中声明了SwitchAppComponent组件：

@NgModule({
    imports: [
    ]
    declarations: [
        SwitchAppComponent
    ],
    bootstrap: [AppComponent]
})
export class AppModule {
}

那么就会出现这个错误：

More than one component: AppComponent,SwitchAppComponent

[ERROR ->]<switch-app [account]="cache.accountInfo" [app]="cache.current_app"></switch-app>

我是一名有用的助手，可以为您翻译文本。

我检查了我的应用程序，发现AppComponent和SwitchAppComponent的选择器不同。

以下是这两个组件的简要代码：

@Component({
    selector: '[app]',
    styleUrls: ['./app.css', './custom.scss'],
    encapsulation: ViewEncapsulation.None,
    templateUrl: './app.html'
})
export class AppComponent extends CommonComponent implements OnInit {

    cache = cache;
}

switch-app 组件：

@Component({
    selector: 'switch-app',
    templateUrl: './switch-app.html'
})
export class SwitchAppComponent implements OnInit {
    @Input('app') app;
    @Input('account') account;
    ngOnInit() { console.log(this.account, this.app);}
}

- shun

---

我找到了问题所在，因为我用一个属性[app]声明了我的AppComponent，但是当我将switch-app组件插入其中时，我使用了一个[app]属性作为它的输入。只要我改变switch-app的[app]属性，一切都正确了。 - shun

Answer 1

问题在这里：

 <switch-app [account]="cache.accountInfo" [app]="cache.current_app"></switch-app>

这个匹配了switch-app选择器和[app]选择器，它们都是组件的选择器。Angular不支持在同一元素上使用2个组件。

不确定您在这里尝试做什么，也许一个组件应该改为指令？

- Philippe Plantier