我有一个关于Angular2(v2.2.1)和TypeScript的项目,我使用Angular CLI(1.0.0-beta.21).它工作正常.现在我想用Angular i18n添加多语言支持.接下来是官方文档的安装我安装了这个包:
npm install @angular/compiler-cli @angular/platform-server --save
我跑了这个命令:
"./node_modules/.bin/ng-xi18n" -p src/tsconfig.json
它返回给我错误信息:
Error: Unexpected value 'SharedModule' imported by the module 'AppModule'
at D:\Projects\courier-landingpage\node_modules\@angular\compiler\bundles\compiler.umd.js:14675:33
at Array.forEach (native)
at CompileMetadataResolver._loadNgModuleMetadata (D:\Projects\courier-landingpage\node_modules\@angular\compiler\bundles\compiler.umd.js:14660:51)
at CompileMetadataResolver.getUnloadedNgModuleMetadata (D:\Projects\courier-landingpage\node_modules\@angular\compiler\bundles\compiler.umd.js:14636:23)
at addNgModule (D:\Projects\courier-landingpage\node_modules\@angular\compiler\bundles\compiler.umd.js:12944:43)
at D:\Projects\courier-landingpage\node_modules\@angular\compiler\bundles\compiler.umd.js:12957:16
at Array.forEach (native)
at _createNgModules (D:\Projects\courier-landingpage\node_modules\@angular\compiler\bundles\compiler.umd.js:12956:28)
at analyzeNgModules (D:\Projects\courier-landingpage\node_modules\@angular\compiler\bundles\compiler.umd.js:12700:16)
at Object.analyzeAndValidateNgModules (D:\Projects\courier-landingpage\node_modules\@angular\compiler\bundles\compiler.umd.js:12704:20)
Run Code Online (Sandbox Code Playgroud)
有没有办法解决这个错误或者让其他方法继续国际化?
列出我的AppModule:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';
import { SharedModule } …Run Code Online (Sandbox Code Playgroud)首先,我在Stackblitz上有一个示例https://stackblitz.com/edit/angular-th31vj,您可以在其中检查我的应用。
这是一个非常简单的应用程序,其中有一个服务(StoreService)以RxJS方式管理数据和2个组件:AppComponent和Catalog Component。AppComponent包含类别和路由器出口的列表。我也想在类别列表下显示当前类别。
那就是我的AppComponent的样子
<h3>Categories</h3>
<ul>
<li *ngFor="let category of store.categories$ | async">
<a [routerLink]="['/catalog', category.id]">{{ category.name }}</a>
</li>
</ul>
<p> Selected category: {{ store.selectedCategory$.name | async }} </p>
<router-outlet></router-outlet>
Run Code Online (Sandbox Code Playgroud)
import { Component, OnInit } from '@angular/core';
import { StoreService } from './store.service';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: [ './app.component.css' ]
})
export class AppComponent implements OnInit {
name = 'Angular';
constructor(public store: StoreService) {}
ngOnInit() {
this.store.selectedCategory$.subscribe(category => console.log('App component received new category', category));
}
} …Run Code Online (Sandbox Code Playgroud)