TypeError：this._platformStrategy.getBaseHrefが関数ではありません

Question

多くの輸入品がある私のAngular 4/5コンポーネントの単体テストを作成しようとしています。しかし、輸入LocationStrategy後に私が得た：私は@angular/commonからLocationStrategyをインポートするときに表示されます

TypeError: this._platformStrategy.getBaseHref is not a function

。

私spec.tsファイルがあります：あなたはケースでは、誰の利益のために、すでにちょうどこれに対する解決策を見つけたかもしれ

student.component.spec.ts

import {TestBed, ComponentFixture, async} from '@angular/core/testing'; 
import {Observable} from 'rxjs/Observable'; 
import 'rxjs/add/observable/of'; 

import {StudentComponent} from './student.component'; 
import {StudentService} from './student.service'; 
import {Student} from './student'; 
import {RecordsCount} from '../shared/entities/recordsCount'; 
import {Group} from '../groups/group'; 
import {GroupsService} from '../groups/groups.service'; 
import {NO_ERRORS_SCHEMA} from '@angular/core'; 
import { HttpClient } from '@angular/common/http'; 
import { HttpHandler } from '@angular/common/http'; 
import { OverlayModule } from '@angular/cdk/overlay'; 
import { MainMaterialModule } from '../main-material.module'; 
import { HttpClientTestingModule } from '@angular/common/http/testing'; 
import { UpdateDeleteEntityService } from '../entity-table/update-delete-entity.service'; 
import { InfoModalService } from '../info-modal/info-modal.service'; 
import { ActivatedRoute } from '@angular/router'; 
import { Location, LocationStrategy } from '@angular/common'; 

describe('StudentComponent',() => { 
    let fixture: ComponentFixture<StudentComponent>; 
    let component: StudentComponent; 
    let mockRouter = { 
    navigate: jasmine.createSpy('navigate') 
    }; 

    beforeEach(async(() => { 
    TestBed.configureTestingModule({ 
     declarations: [StudentComponent], 
     schemas: [NO_ERRORS_SCHEMA], 
     imports: [MainMaterialModule, HttpClientTestingModule], 
     providers: [ 
     StudentService, 
     GroupsService, 
     InfoModalService, 
     UpdateDeleteEntityService, 
     Location, 
     LocationStrategy, 
     { provide: ActivatedRoute, useValue: mockRouter}] 
    }).compileComponents(); 
    })); 

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

    it('should return array of students',() => { 
    const studentService = fixture.debugElement.injector.get(StudentService); 
    fixture.detectChanges(); 
    const students: Student[] = [ 
     { 
     userId: 20, 
     gradebookId: 'UX-3311221', 
     studentSurname: 'Лящовський', 
     studentName: 'Андрій', 
     studentFname: 'Іванович', 
     groupId: '2', 
     plainPassword: '', 
     photo: '' 
     }, { 
     userId: 13, 
     gradebookId: 'UY-3019273', 
     studentSurname: 'Заник', 
     studentName: 'Іван', 
     studentFname: 'Григорович', 
     groupId: '5', 
     plainPassword: '', 
     photo: '' 
     }, { 
     userId: 155, 
     gradebookId: 'UT-1029384', 
     studentSurname: 'Лінкольн', 
     studentName: 'Абрагім', 
     studentFname: 'Зимонсович', 
     groupId: '1', 
     plainPassword: '', 
     photo: '' 
    }]; 
    const recordsCount: RecordsCount = { 
     numberOfRecords: '3' 
    }; 
    const spy = spyOn(studentService, 'getStudentsRange').and.returnValue(Observable.of([students, recordsCount])); 

    component.getStudents(); 

    expect(component.students).toEqual(students); 
    }); 

}); 

Answer 1

は、他にも同じ問題があります。私はこの問題に遭遇し、以下の解決策が働いたことを発見しました：

LocationStrategyは抽象クラスであり、PathLocationStrategyなどのLocationStrategyを拡張する具体的なクラスを提供する必要があると思います。私はプロバイダ

{ provide: LocationStrategy, useClass: PathLocationStrategy },

とPathLocationStrategyがAPP_BASE_REFに依存しているので、私はまたのプロバイダを追加したの私のリストに、次の追加その

{ provide: APP_BASE_HREF, useValue: '/my/app'}

APP_BASE_HREFとPathLocationStrategyから輸入されている

@角度/共通はLocationとLocationStrategyと同じ