Angular 角度7+;本地化路由器:测试语言交换
我对Angular是个新手,现在被以下问题困扰着 我与Angular 角度7+;本地化路由器:测试语言交换,angular,typescript,Angular,Typescript,我对Angular是个新手,现在被以下问题困扰着 我与ngx translate一起使用http://myapp/en/home和http://myapp/fr/home。语言交换通过路由器链接完成: <a mat-button [routerLink]="'/en'" class="en-link">en</a> <a mat-button [routerLink]="'/fr'" class="fr-link">fr</a> 一切正常,现在我
ngx translate一起使用http://myapp/en/home
和http://myapp/fr/home
。语言交换通过路由器链接完成:
<a mat-button [routerLink]="'/en'" class="en-link">en</a>
<a mat-button [routerLink]="'/fr'" class="fr-link">fr</a>
一切正常,现在我想测试语言切换:
const routes: Routes = [{path: '', component: AppComponent}];
describe('AppComponent', () => {
let fixture: ComponentFixture<AppComponent>;
let translate: TranslateService;
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [
LocalizeRouterModule.forRoot(routes, {
parser: {
provide: LocalizeParser,
useFactory: LocalizeHttpLoaderFactory,
deps: [TranslateService, Location, LocalizeRouterSettings]
}
}),
RouterTestingModule.withRoutes(routes),
HttpClientTestingModule,
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: TranslateHttpLoaderFactory,
deps: [HttpClient]
}
})
],
declarations: [AppComponent]
}).compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(AppComponent);
});
it('should switch language', () => {
fixture.detectChanges();
const selector = By.css('.fr-link');
const frLink = fixture.debugElement.query(selector);
fixture.whenStable().then(() => {
frLink.nativeElement.click();
const injector = getTestBed();
const translate = injector.get(TranslateService);
expect(translate.currentLang).toBe('fr');
});
});
});
DashboardComponent
是一个容器组件,通常绑定到AppRoutingModule
中的空路径:
export const routes: Routes = [{path: '', component: DashboardComponent}]
我遗漏了什么?在我看来,本地化路由器不适用于路由器测试模块。我在他们的github repo上也找不到提供完整模块示例的示例。他们转而测试服务,也许你可以看看:在我看来,本地化路由器不适用于RouterTestingModule。我在他们的github repo上也找不到提供完整模块示例的示例。他们会测试服务,也许你可以看看:
DashboardComponent should create
Uncaught Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'fr'
Error: Cannot match any routes. URL Segment: 'fr'
at ApplyRedirects.push../node_modules/@angular/router/fesm5/router.js.ApplyRedirects.noMatchError (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/router/fesm5/router.js:2469:1)
at CatchSubscriber.selector (http://localhost:9876/_karma_webpack_/webpack:/node_modules/@angular/router/fesm5/router.js:2450:1)
at CatchSubscriber.push../node_modules/rxjs/_esm5/internal/operators/catchError.js.CatchSubscriber.error (http://localhost:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/operators/catchError.js:34:1)
at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._error (http://localhost:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/Subscriber.js:80:1)
at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.error (http://localhost:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/Subscriber.js:60:1)
at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._error (http://localhost:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/Subscriber.js:80:1)
at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.error (http://localhost:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/Subscriber.js:60:1)
at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._error (http://localhost:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/Subscriber.js:80:1)
at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.error (http://localhost:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/Subscriber.js:60:1)
at TapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/tap.js.TapSubscriber._error (http://localhost:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/operators/tap.js:61:1) thrown
export const routes: Routes = [{path: '', component: DashboardComponent}]