Renderer cannot be used in Service?

Issue

Is it possible to use Renderer in Service or just in component?

If I inject renderer into service I get error, that the Renderer provider is missing.

See plunker's console:

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

Solution

Yea, like Eric said you can just pass it from the actual component to the Service and it will work.

HOWEVER, the responsability to render an object is of the component, not the Service, services are meant to handle business logic (retrieve the data mostly, depending on your app).

The whole idea is that you can reuse your whole services layer if you ever change your presentation framework/library or anything presentation related stuff at all, If you do things like that you'd be coupling your services to your presentation, making harder to make changes later on.

If you want to reuse the rendering logic between components, I'd create a parent abstract class with the logic and extend it with a Component, the children component would get injected the renderer and pass it to the parent class with the super() method that should call the parent's constructor.

At the very least you can make an @Injectable object like the proposed solution, but call it SomethingRenderer instead of Service and separate it from the rest of your real Data Services.

Answered By - Langley