NullInjectorError:没有SlicePipe的提供者

时间:2018-03-25 12:06:34

标签: javascript angular typescript angular-pipe

我创建了使用其他内置pipe的自定义pipe 这是一个例子:

import { Pipe, PipeTransform } from '@angular/core';
import { SlicePipe } from '@angular/common';
import { isNumeric } from 'rxjs/util/isNumeric';

@Pipe({ name: 'range' })
export class RangePipe implements PipeTransform {
    constructor(private slicePipe: SlicePipe) { }

    transform(data: any, page: number, size: number): any {
        if (Array.isArray(data) && isNumeric(page) && isNumeric(size)) {
            const start_index = (page - 1) * size;
            if (data.length < start_index) {
                return [];
            } else {
                return this.slicePipe.transform(data.slice(start_index), size);
            }
        } else {
            return data;
        }
    }
}

还将我的自定义pipe添加到app.module

@NgModule({
imports: [
    BrowserModule,
    FormsModule,
    routing
],
declarations: [
    AppComponent,
    ...
    RangePipe
],
providers: [],
bootstrap: [AppComponent]
})

但是得到错误

  

错误错误:未捕获(承诺):错误:StaticInjectorError(AppModule)[RangePipe - &gt; SlicePipe]:     StaticInjectorError(Platform:core)[RangePipe - &gt; SlicePipe]:       NullInjectorError:没有SlicePipe的提供者!

我的问题在哪里?我忘了注册一些东西吗?

3 个答案:

答案 0 :(得分:1)

@NgModule({
imports: [
    ...
],
declarations: [
    ...
],
providers: [RangePipe],
bootstrap: [AppComponent]
})

答案 1 :(得分:0)

假设您需要在角度DI中使用自定义类。

LoadSomething

并且它取决于其他一些类

import {FactoryProvider} from "@angular/core";
import {SlicePipe} from "@angular/common";

class AwesomePipe{
  constructor(private slicePipe: SlicePipe){

  }
}

答案 2 :(得分:0)

只需扩展SlicePipe

即可
import { Pipe, PipeTransform } from '@angular/core';

import { SlicePipe } from '@angular/common';
import { isNumeric } from 'rxjs/util/isNumeric';

@Pipe({ name: 'range' })
export class RangePipe extends SlicePipe implements PipeTransform {
    public transform(data: any, page: number, size: number): any {
        if (Array.isArray(data) && isNumeric(page) && isNumeric(size)) {
            const start_index = (page - 1) * size;
            if (data.length < start_index) {
                return [];
            } else {
                return super.transform(data.slice(start_index), size);
            }
        } else {
            return data;
        }
    }
}

希望得到这个帮助。