測量角2父路由

Question

我訪問這樣的父路由值組件：

ngOnInit() { 
    this.route.parent.parent.params.subscribe(params => { 
     this.placeService.getPlace(params['id']).subscribe(place => this.place = place); 
    }); 
    } 

下面是案件的全部文件時，它幫助。

import { Component, OnInit } from '@angular/core'; 
import { ActivatedRoute } from '@angular/router'; 
import { PlaceService } from '../place.service'; 
import { Place } from '../place'; 

@Component({ 
    selector: 'app-diner-review-list', 
    templateUrl: './diner-review-list.component.html', 
    styleUrls: ['./diner-review-list.component.css'], 
    providers: [PlaceService] 
}) 
export class DinerReviewListComponent implements OnInit { 
    place: Place; 

    constructor(private route: ActivatedRoute, private placeService: PlaceService) { } 

    ngOnInit() { 
    this.route.parent.parent.params.subscribe(params => { 
     this.placeService.getPlace(params['id']).subscribe(place => this.place = place); 
    }); 
    } 
} 

我的問題是，當我運行測試，我得到

TypeError: Cannot read property 'parent' of null

這是有道理的。 this.route.parent是null。但我不在乎;我現在沒有測試路線。

這裏是我的測試：

/* tslint:disable:no-unused-variable */ 
import { async, ComponentFixture, TestBed } from '@angular/core/testing'; 
import { RouterTestingModule } from '@angular/router/testing'; 
import { By } from '@angular/platform-browser'; 
import { DebugElement } from '@angular/core'; 
import { MockPlaceService } from '../../../testing/mock-place.service'; 

import { DinerReviewListComponent } from './diner-review-list.component'; 
import { PlaceService } from '../place.service'; 

let mockPlaceService = new MockPlaceService(); 

describe('DinerReviewListComponent',() => { 
    let component: DinerReviewListComponent; 
    let fixture: ComponentFixture<DinerReviewListComponent>; 

    beforeEach(async(() => { 
    TestBed.configureTestingModule({ 
     declarations: [ 
     DinerReviewListComponent 
     ], 
     imports: [RouterTestingModule] 
    }) 
    .overrideComponent(DinerReviewListComponent, { 
     set: { 
     providers: [ 
      { provide: PlaceService, useValue: mockPlaceService } 
     ] 
     } 
    }) 
    .compileComponents(); 
    })); 

    beforeEach(() => { 
    fixture = TestBed.createComponent(DinerReviewListComponent); 
    component = fixture.componentInstance; 
    fixture.detectChanges(); 
    }); 

    it('should create',() => { 
    expect(component).toBeTruthy(); 
    }); 
}); 

我怎樣才能得到我的測試，無論是忽略缺席的航線價值，或者提供假的？

Answer 1

我最終以後一種方式解決了這個問題：提供了一條虛假的路線。這就是我所做的。

請注意提及mockActivatedRoute的零件。

/* tslint:disable:no-unused-variable */ 
import { async, ComponentFixture, TestBed } from '@angular/core/testing'; 
import { RouterTestingModule } from '@angular/router/testing'; 
import { ActivatedRoute } from '@angular/router'; 
import { By } from '@angular/platform-browser'; 
import { DebugElement } from '@angular/core'; 
import { Observable } from 'rxjs/Observable'; 
import 'rxjs/add/observable/of'; 

import { MockPlaceService } from '../../../testing/mock-place.service'; 

import { DinerReviewListComponent } from './diner-review-list.component'; 
import { PlaceService } from '../place.service'; 

let mockPlaceService = new MockPlaceService(); 

class MockActivatedRoute { 
    parent: any; 
    params: any; 

    constructor(options) { 
    this.parent = options.parent; 
    this.params = options.params; 
    } 
} 

let mockActivatedRoute = new MockActivatedRoute({ 
    parent: new MockActivatedRoute({ 
    parent: new MockActivatedRoute({ 
     params: Observable.of({ id: '1' }) 
    }) 
    }) 
}); 

describe('DinerReviewListComponent',() => { 
    let component: DinerReviewListComponent; 
    let fixture: ComponentFixture<DinerReviewListComponent>; 

    beforeEach(async(() => { 
    TestBed.configureTestingModule({ 
     declarations: [ 
     DinerReviewListComponent 
     ], 
     imports: [RouterTestingModule] 
    }) 
    .overrideComponent(DinerReviewListComponent, { 
     set: { 
     providers: [ 
      { provide: PlaceService, useValue: mockPlaceService }, 
      { provide: ActivatedRoute, useValue: mockActivatedRoute } 
     ] 
     } 
    }) 
    .compileComponents(); 
    })); 

    beforeEach(() => { 
    fixture = TestBed.createComponent(DinerReviewListComponent); 
    component = fixture.componentInstance; 
    fixture.detectChanges(); 
    }); 

    it('should create',() => { 
    expect(component).toBeTruthy(); 
    }); 
});