TypeError: this._platformStrategy.getBaseHref ist keine Funktion

Question

Ich versuche Einheitentests für meine Angular 4/5 Komponenten zu erstellen, wo ich viele Importe habe. Aber nach dem Import LocationStrategy bekam ich ein:

TypeError: this._platformStrategy.getBaseHref is not a function

die die Anzeige, ist, wenn ich LocationStrategy von @angular/common importieren.

Es ist meine spec.ts Datei:

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

Sie haben die Lösung dieses Problems bereits gefunden kann aber nur für den Fall, und zugunsten von jedermann sonst mit dem gleichen Problem. Ich bin auf dieses Problem gestoßen und habe folgende Lösung gefunden:

Ich denke, das Problem ist, dass LocationStrategy eine abstrakte Klasse ist und Sie eine konkrete Klasse bereitstellen müssen, die LocationStrategy wie PathLocationStrategy erweitert. Ich fügte hinzu, die folgende meiner Liste der Anbieter

{ provide: LocationStrategy, useClass: PathLocationStrategy },

und dann, weil PathLocationStrategy eine Abhängigkeit von APP_BASE_REF hat habe ich auch noch einen Anbieter für das

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

APP_BASE_HREF und PathLocationStrategy importiert werden von @ eckig/gemeinsam gleich wie Ort und OrtStrategie