web-dev-qa-db-fra.com

Angular 4 - Echec: impossible de résoudre tous les paramètres pour ActivatedRoute: (?,?,?,?,?,?,?,?,?)?)

J'ai référé le lien suivant pour obtenir les réponses, mais je n'ai pas trouvé de solution satisfaisante pour mon scénario. Erreur: (SystemJS) Impossible de résoudre tous les paramètres pour ActivatedRoute: (?,?,?,?,?,?,?,?,?)

Par conséquent, j'ai essayé de supprimer l'itinéraire activé des fournisseurs et le banc d'essai ne passe toujours pas. Ça montre

Erreur: Aucun fournisseur pour ActivatedRoute!

Voici donc mon code, je veux utiliser mon banc d’essai dans l’application angular qui utilise Jasmine. 

import { ActivatedRoute } from '@angular/router';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { RouterModule, Routes } from '@angular/router';
import { RouterTestingModule } from '@angular/router/testing';

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

  beforeEach(async(() => {
    TestBed.configureTestingModule({ 
      imports: [ RouterModule, RouterTestingModule ],
      declarations: [ SomeComponent ],
      providers: [ ActivatedRoute ],
    })
    .compileComponents();
  }));

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

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

Erreur lors de l'obtention

enter image description here

angularunit-testingkarma-jasmineroutertestbed
21
Lakindu Gunasekara

Vous souhaitez injecter un faux ActivatedRoute dans votre composant, puisque vous le créez vous-même dans le test, le routeur ne le crée donc pas pour vous et n'injecte pas ActivatedRoute. Donc, vous pouvez utiliser quelque chose comme ceci:

describe('SomeComponent', () => {

  const fakeActivatedRoute = {
    snapshot: { data: { ... } }
  } as ActivatedRoute;

  beforeEach(async(() => {
    TestBed.configureTestingModule({ 
      imports: [ RouterTestingModule ],
      declarations: [ SomeComponent ],
      providers: [ {provide: ActivatedRoute, useValue: fakeActivatedRoute} ],
    })
    .compileComponents();
  }));
});
37
JB Nizet

Voici une solution pour angular 7

{
    provide: ActivatedRoute,
    useValue: {
        snapshot: {
            paramMap: {
                get(): string {
                    return '123';
                },
            },
        },
    },
},
0
Pete
{
  provide: ActivatedRoute,
  useValue: {
    snapshot: {
      queryParamMap: {
        get(): number {
          return 6;
        }
      }
    }
  }
}
0
Sourav Golui