Как исправить ошибку «Ошибка: труба« фильтр »не может быть найдена! Ошибка: труба« фильтр »не найдена!» В angular 10? - PullRequest
0 голосов
/ 04 августа 2020

У меня есть фильтр, который при поиске имени возвращает мне данные, содержащие это имя, но отправляет мне только эту ошибку в консоли браузера. он просто не показывает мне страницу

html

<div class="content">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-4" style="padding-bottom: 15px;" >
<div class="card_book">
<div class="card">
 <div class="card-body text-center">
    <form>
    <fieldset>
          
    <div class="form-group">
      <input type="text" class="form-control" name="filterPost"  placeholder="Nombre"  [(ngModel)]="filterPost" >
      <br>   
    </div> 
  </fieldset>     </form>
  </div></div></div></div></div></div>
     
        
    
        <div class="container">
            <div class="row">
   <div class="col-xs-12 col-sm-6 col-md-4" style="padding-bottom: 15px;" *ngFor="let contacts of contacts | filtro:filterPost">
     <div class="card_book">
       <div class="card">
         <div class="card-body text-center">
                      
                      <h3 >Nombre: {{contacts.name}}</h3>
                      <h5>Edad: {{contacts.number}}</h5 >
                      <h5>Email: {{contacts.email}}</h5>
      <h5 class="card-text">Fecha de nacimiento: {{contacts.date}}</h5>
      <h6 style="color: red;">Id: {{contacts.id}}</h6>
      <button type="button" class="btn btn-primary" (click)="generarPDF()">
      <img src="assets/img/descargar.png"  alt="DESCARGAR PDF" title="Descargar pdf"> DESCARGAR PDF
             
                      </button>
                    
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
    </div>
      `````````

ts здесь идет только эта

  filterPost = '';

     `````````

pipe Я действительно не знаю, здесь ли проблема

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

@Pipe({
  name: 'filtro'
})
export class FiltroPipe implements PipeTransform {

  transform(value: any, arg: any): any {
    if (arg === '' || arg.length < 3) return value;
    const resultPosts = [];
    for (const post of value) {
      if (post.email.toLowerCase().indexOf(arg.toLowerCase()) > -1) {
        resultPosts.push(post);
      };
    };
    return resultPosts;
  }

}

Он уже импортирован в модуль, но я не знаю, почему я получаю эту ошибку

import {FormsModule} from '@angular/forms';
import { FiltroPipe } from './pipes/filtro.pipe'




@NgModule({
  declarations: [
    FiltroPipe, 
  AppComponent,
  SendEmailComponent, 
  NavbarComponent,
  SidebarComponent,
  InactivityTimerComponent,
 
   ],
   
  imports: [
    BrowserModule,
    AppRoutingModule,
    ReactiveFormsModule,
    AngularFireModule.initializeApp(environment.firebaseConfig),
    AngularFirestoreModule,
    AngularFireAuthModule, FormsModule
  ],
  providers: [AuthService, CanPaginaPrincipalGuard, AngularFirestore,DataDbService, 
   
  
  ],

 
  bootstrap: [AppComponent]
})
export class AppModule { }

Ответы [ 2 ]

0 голосов
/ 04 августа 2020

, вы должны импортировать его в nearest module или app.module.ts

Пожалуйста, вставьте канал в declarations, когда вы используете его в HTML (например, | 'pipename')

 @NgModule({
    // ---,
    declarations:[],
    // ----,

Пожалуйста, вставьте трубу в providers, если вы используете ее в файле .ts (например, pipename.transform())

 @NgModule({
    // ----,
    providers:[],
    // ----
0 голосов
/ 04 августа 2020

Вам необходимо зарегистрировать FiltroPipe в провайдерах файла component typescript. Тогда заработает.

...