angular2不止一个组件错误

时间:2016-08-23 09:13:15

标签: angular components

我只是将我的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);}
}

1 个答案:

答案 0 :(得分:6)

问题在于:

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

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

不确定你在这里要做什么,也许一个组件应该是指令呢?