Wie füge ich Document in Service ein?

Ich habe eine Angular 2-Anwendung. Um das DocumentObjekt in Tests zu verspotten , möchte ich es wie folgt in den Dienst einfügen:

import { Document } from '??' 

@Injectable()
export class MyService {
  constructor(document: Document) {}
}

Der TitleDienst von Angular verwendet die interne getDOM()Methode .

Gibt es eine einfache Möglichkeit, das Documentin den Dienst einzuspeisen? Wie soll ich im providersArray darauf verweisen ?

Dies wird seit einiger Zeit von Angular unterstützt.

Sie können die DOCUMENTvom @angular/commonPaket bereitgestellte Konstante verwenden .

Beschreibung der DOCUMENTKonstante (aus der API-Dokumentation entnommen ):

Ein DI-Token, das den Haupt-Rendering-Kontext darstellt. In einem Browser ist dies das DOM-Dokument.

Ein Beispiel ist wie folgt:

my-service.service.ts:

import { Inject, Injectable } from '@angular/core';
import { DOCUMENT } from '@angular/common';

@Injectable()
export class MyService {
  constructor(@Inject(DOCUMENT) private document: Document) {}
}

my-service.service.spec.ts

import { provide } from '@angular/core';
import { DOCUMENT } from '@angular/common';

import { MyService } from './my-service';

class MockDocument {}

describe('MyService', () => {
  beforeEachProviders(() => ([
    provide(DOCUMENT, { useClass: MockDocument }),
    MyService
  ]));

  ...
});

Ich kann die Frage von adamdport nicht direkt kommentieren (noch nicht 50 Wiederholungspunkte), aber hier ist es wie in den eckigen Dokumenten angegeben.

Blockquote @ GünterZöchbauer es sieht so aus, als wäre DOKUMENT veraltet. Irgendeine Idee, wie man das macht, wenn es weg ist? Wie würde ich beispielsweise das Favicon dynamisch einstellen?

Anstatt wie folgt aus dem Plattformbrowser zu importieren:

import { DOCUMENT } from '@angular/platform-browser';

Importieren Sie es aus eckigen gemeinsamen:

import {DOCUMENT} from '@angular/common';

zusätzlich zu @ Günter Zöchbauers Antwort.

Angular definiert DOKUMENT als InjectionToken

export const DOCUMENT = new InjectionToken<Document>('DocumentToken');

dom_tokens.ts

Und fügen Sie es mit Dokument in browser.ts ein

{provide: DOCUMENT, useFactory: _document, deps: []}


export function _document(): any {
  return document;
}

Wenn wir es verwenden, müssen wir es daher nur injizieren @Inject(DOCUMENT)

oder verwenden Sie den Token direkt in deps:[DOCUMENT]

import { Inject, Injectable } from '@angular/core';
import { DOCUMENT } from '@angular/common';

@Injectable()
export class MyService {
  constructor(@Inject(DOCUMENT) private document) {}
}

Es ist das ": Dokument", das das Problem verursacht.