渲染器不能用于服务？

是否可以在服务中使用Renderer或仅在组件中使用？

如果我将渲染器注入服务器,则会出现错误,即Renderer提供程序丢失.

请参阅plunker的控制台:

import {Injectable, Component, Renderer, ElementRef} from 'angular2/core';

@Injectable()
class TestService {
  constructor(
    private _renderer: Renderer
    ) {}

  renderElement(elementRef: any) {
    this._renderer.createElement(elementRef.nativeElement, 'div');
  }
}

http://plnkr.co/edit/e8qlznCVbvZnXbLTk36z?p=preview

可能与Angular 4中的使用渲染器重复

你不能注入Renderer2,但我们可以运行RendererFactory2来获取服务中的Renderer2实例@Injectable().有两种不同的方法可以解决这个问题.

在Service中获取Renderer2的实例

例如,Angular在网络工作者内部使用的方式.我用下面的代码解决了这个问题:

import { Renderer2, RendererFactory2 } from '@angular/core';

@Injectable()
class Service {
    private renderer: Renderer2;

    constructor(rendererFactory: RendererFactory2) {
        this.renderer = rendererFactory.createRenderer(null, null);
    }
}

// declare public property in your service
@Injectable()
class Service {
  renderer: Renderer;
}

// pass renderer to service in your component file
class App {
  name:string;
  constructor(service: Service, renderer: Renderer2) {
      service.renderer = renderer;
  }
}