在Angular 4中使用Renderer

前端之家收集整理的这篇文章主要介绍了在Angular 4中使用Renderer前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我理解为什么最好使用渲染器而不是直接操纵Angular2项目中的DOM.但是,我已经多次卸载,清除缓存,重新安装Node,Typescript和Angular-CLI,并且在尝试注入渲染器时仍然会出错.
import { Injectable,Renderer2 } from '@angular/core';
constructor(private renderer: Renderer2) {}

__zone_symbol__message: “No provider for Renderer2!”

__zone_symbol__stack:”Error↵ at Error.ZoneAwareError

有没有人有任何想法我做错了什么?

根据你的进口
import { Injectable,Renderer2 } from '@angular/core'

我怀疑你是在尝试在你的服务类中注入Renderer2.它不会起作用.您无法在服务中注入Renderer2.它应该适用于组件内提供的组件和服务.

我们可以看看源代码https://github.com/angular/angular/blob/4.0.1/packages/core/src/view/provider.ts#L363-L373

while (view) {
  if (elDef) {
    switch (tokenKey) {
      case RendererV1TokenKey: {
        const compView = findCompView(view,elDef,allowPrivateServices);
        return createRendererV1(compView);
      }
      case Renderer2TokenKey: {
        const compView = findCompView(view,allowPrivateServices);
        return compView.renderer;
      }

它只在元素注入器树中检查.并且没有其他地方可以提供此令牌

因此,当您调用某些服务方法https://github.com/angular/angular/issues/17824#issuecomment-311986129时,您必须将Renderer2从组件传递到服务

或者您可以在组件内提供服务

@Injectable()
export class Service {
  constructor(private r: Renderer2) {}
}
@Component({
  selector: 'my-app',templateUrl: `./app.component.html`,providers: [Service]
})
export class AppComponent { 
  constructor(private service: Service) {}
}
原文链接:https://www.f2er.com/angularjs/143803.html

猜你在找的Angularjs相关文章