带有RC6的角2 SystemJS问题

Question

在更新到RC6之后，我的应用程序在运行时遇到了一些问题。

由于官方示例来自变更负担g，我更改了系统to。

但我仍然会遇到这样的编译错误："Module '"D:/Myproject/WebClient/node_modules/@angular/router/index"‘没有导出的成员’路由器_指令‘“。

看起来编译器采用默认的index.js文件，而不是umd包.编译是通过gulp任务完成的，有以下选项：

"module": "system", "moduleResolution": "node", "target": "ES5", "experimentalDecorators": true, "emitDecoratorMetadata": true, "allowSyntheticDefaultImports": false我得到了路由器模块和表单模块的这个错误。

路由器为V3.0.0-rc.2，表单为V.2.0.0-rc6。

我认为更多的问题是我的系统is没有被正确地读取。

SystemJS：

var map = {
'app': 'public/app',
'@angular/core': 'npm:@angular/core/bundles/core.umd.js',
'@angular/common': 'npm:@angular/common/bundles/common.umd.js',
'@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
'@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
'@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
'@angular/http': 'npm:@angular/http/bundles/http.umd.js',
'@angular/router': 'npm:@angular/router/bundles/router.umd.js',
'@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
'rxjs': 'npm:rxjs',
'symbol-observable': 'npm:symbol-observable',
'moment': 'npm:moment',
'ng2-charts': 'npm:ng2-charts',
'ng2-translate/ng2-translate': 'npm:ng2-translate',
'angular2-highcharts': 'npm:angular2-highcharts',
'highcharts/highstock.src': 'npm:highcharts',
'primeng': 'npm:primeng'
};

var packages = {
'app': { main: 'main', defaultExtension: 'js' },
'rxjs': { main: 'Rx.js',  defaultExtension: 'js' },
'moment': { main: 'moment', defaultExtension: 'js', type: 'cjs'},
'symbol-observable': { main: 'index.js', defaultExtension: 'js' },
'ng2-charts': { main: 'ng2-charts', defaultExtension: 'js' },
'ng2-translate/ng2-translate': { main: 'ng2-translate', defaultExtension: 'js' },
'angular2-highcharts': { main: 'index', defaultExtension: 'js' },
'highcharts/highstock.src': { main: 'highstock.src', defaultExtension: 'js' },
'primeng': { defaultExtension: 'js' }s
};


System.config({
map: map,
packages: packages,
paths: {
    // paths serve as alias
    'npm:': 'node_modules/'
}
//format: 'register'
});

艾因博特有什么想法吗？提前感谢

Answer 1

根据rc6中的新更改，取消推荐的指令并在默认的角度功能中引入ngModule，因此您必须按照路由文档配置@angular/router中的RouterModule，以配置路由，然后可以使用RouterModule提供的指令。

Answer 2

您必须从所有组件中删除ROUTER_DIRECTIVES、FORM_DIRECTIVES和CORE_DIRECTIVES。相反，为所有组件创建模块。在您的BrowserModule中导入AppModule，并为您需要表单指令的所有模块导入FormModule。

更多信息可以在这里找到：https://angular.io/docs/ts/latest/guide/architecture.html

例如，AppModule看起来如下所示：

import {NgModule} from '@angular/core';
import {BrowserModule} from '@angular/platform-browser';
import {AppComponent}   from './app.component';
// Other imports are removed

@NgModule({
  imports: [BrowserModule, HttpModule, LoginModule, routing],
  declarations: [AppComponent],
  providers: [
    Logger,
    LOG_LOGGER_PROVIDERS,
    AuthenticationService,
    AccountService
  ],
  bootstrap: [AppComponent]

})

export class AppModule {
}