Question

我正在使用Angular2 CLI和Meteor。我注意到当我使用Angular2 CLI生成组件时，如果我想将它包含在另一个模块中，我只需要包含它并将其插入该模块的声明数组中。

menu.component.ts

import { Component, OnInit } from '@angular/core';

import { MenuItem } from './menu-item';                                         
import { MENUITEMS } from './mocks';

@Component({
  selector: 'menu',                                                                                 
  templateUrl: './menu.component.html',                                         
  styleUrls: ['./menu.component.css']
})

export class MenuComponent implements OnInit {

  menuItems: MenuItem[];                                                                        

  constructor() { }                                                                                 

  ngOnInit() {
    this.menuItems= MENUITEMS;                                                          
  }                                                                                                                 

}

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { RouterModule } from '@angular/router';

import { AppComponent } from './app.component';
import { MenuComponent } from './menu/menu.component';
import { HomeComponent } from './home/home.component';
import { TrendsComponent } from './trends/trends.component';
import { ControllerComponent } from './controller/controller.component';
import { WaterPlantComponent } from './water-plant/water-plant.component';
import { DocsComponent } from './docs/docs.component';

@NgModule({
  declarations: [
    AppComponent,
    MenuComponent,
    HomeComponent,
    TrendsComponent,
    ControllerComponent,
    WaterPlantComponent,
    DocsComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    RouterModule.forRoot([
      { path: 'home', redirectTo: '', pathMatch: 'full' },
      { path: '', component: HomeComponent },
      { path: 'trends', component: TrendsComponent },
      { path: 'controller', component: ControllerComponent },
      { path: 'waterplant', component: WaterPlantComponent },
      { path: 'docs', component: DocsComponent }
    ])
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

使用Meteor，只有在我将一个index.ts添加到menu.component文件夹后才能工作：

index.ts

import { MenuComponent } from './menu.component';

export * from './menu.component';

app.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouterModule } from '@angular/router';

import { AppComponent } from './app.component';
import { PARTIES_DECLARATIONS } from './parties';
import { MenuComponent } from './menu/menu.component';

@NgModule({
  imports: [
    BrowserModule
  ],
  declarations: [
    AppComponent,
    ...PARTIES_DECLARATIONS,
    MenuComponent
  ],
  bootstrap: [
    AppComponent
  ]
})
export class AppModule {}

原因可能是＆＃34;模块＆＃34;编译器（在tsconfig.json中），它是用于CLI的ES6和用于Meteor的jscommon？

感谢您的帮助！

Answer 1

看来，使用Angular CLI，您使用的是Angular2样式指南目录结构，而不是Angular-Meteor directory structure，它建议将显式导入的文件放在名为BinaryOperator的目录中。鉴于Meteor的混合模块系统，imports目录之外的文件Meteor default load order可能导致您的问题，这可以通过更改imports创建的MenuComponent来解决。 export中的index.ts语句？

Angular2 CLI Angular-Meteor组件创建

1 个答案: