模块“AppModule”导入了意外的管道。请添加@NgModule注释

Question

我创建了唯一的管道来从数组中删除重复的项目，并将其导入到 app.module.ts 中

这是我的代码。

应用程序模块.ts

import { UniquePipe } from './_pipe/uniquePipe';

@NgModule({
  imports: [BrowserModule, CommonModule, FormsModule, ReactiveFormsModule, HttpClientModule, UniquePipe],
  // tslint:disable-next-line:max-line-length
  declarations: [ AppComponent, UniquePipe],
  exports: [UniquePipe ],
  bootstrap:    [ AppComponent ],
})

独特的Pipe.ts

import { Pipe, PipeTransform } from '@angular/core';
import * as _ from 'lodash';


@Pipe({
  name: 'unique',
  pure: false
})
export class UniquePipe implements PipeTransform {
  transform(value: any): any {
    if (value !== undefined && value !== null) {
      return _.uniqBy(value, 'type');
    }
    return value;
  }
}

应用程序组件.html

 <li class="nav-item" *ngFor="let items of list | unique">
      <a class="nav-link" data-toggle="tab" href="#list"> {{items.type}}</a>
    </li>

我该如何解决这个问题

Answer 1

管道只能添加到 中declarations，因此只需从 中删除管道即可imports。