在上面的示例中,我们创建了一个简单的测试组件TestComponent,其中包含一个带有routerLink指令的链接。我们使用RouterTestingModule来模拟路由功能。 在测试文件中,使用TestBed.configureTestingModule方法配置测试模块。在这个方法中,我们导入RouterTestingModule并将TestComponent声明为测试
[routerLink]="['./']" routerLinkActive [routerLinkActiveOptions]="{exact: true}" #rla1="routerLinkActive" [active]="rla1.isActive">Test A {{ rla1.isActive }} Test B {{ rla2.isActive }} 要留意第一个如果忘记放 exact: true, 那么第二个被匹配到的时候它也会 active 哦,所以使用...
// 1 引入路由模块 AppRoutingModule ], import{NgModule}from'@angular/core'; import{Routes,RouterModule}from'@angular/router'; // 3 引入页面组件 // ts语法,支持解构的时候,为属性起别名 import{HomeComponentasHome}from'./pages/home/home.component'; import{ListComponentasList}from'./pages/list/l...
那么根据以上两种情况,我拆分成两种,一是Stubs,二是RouterTestingModule 路由测试模块。 1、Stubs 根据上面分类,只需要测试当前组件routerLink的正确性,而不对路由导航进行验证。 可能这个会更简单一点,因为只需要 Spy 监视Angular 的routerLink的调用不就可以了吗? 可怎么做? 再回过头说Angular最强大的DI系统,利用它,...
TestBed.configureTestingModule({ imports: [ RouterTestingModule ], declarations: [ AppComponent ], }).compileComponents(); })); it('should create the app', async(() => { const fixture = TestBed.createComponent(AppComponent); const app = fixture.debugElement.componentInstance; ...
this.router.navigate({'/detail',news.id});//一个参数this.router.navigate([{ outlets: { let2:null}}]); } 注:navigateByUrl 方法指向完整的绝对路径 传参之后的接收方法: 1.snapshot import { ActivateRoute } from '@angular/router';
angular.module('test', []).factory('testInterceptor', function($q){ var interceptor = { 'request': function(config){ return config; }, 'response': function(resp){ return response; }, 'requestError': function(rejection){ return $q.reject(rejection); ...
Previously, RouterTestingModule only assigned two of the options within ExtraOptions to the router. Now, it assigns the same options as RouterModule does (with the exception of enableTracing at the request of @atscott) via a new shared function assignExt
import { NgModule } from '@angular/core';import { RouterModule, Routes } from '@angular/router';import { HomeComponent } from './home/home.component';import { LoginComponent } from './login/login.component';import { EditComponent } from './edit/edit.component';import {LoginGuard} from...
Angular的Router模块也根据这个标签来构建路由信息。 例如:base='/app',当我们访问路由latest时,实际上访问了/app/#/latest。 在Angular中还提供了,在js中设置这个路径的方法。APP_BASE_HREF 我们在src\app\app.module.ts中 头部修改导入import { LocationStrategy ,HashLocationStrategy , APP_BASE_HREF} from '...