Angular 7 Custom Filter Pipe не работает - PullRequest
Новая
       29

Angular 7 Custom Filter Pipe не работает

0 голосов
/ 24 апреля 2019

Я действительно новичок в Angular 7 и начинаю работать с проектом Angular 7 И для этого я создаю Angular 7 Custom Pipe для фильтрации, но он не работает. Отображение ошибки: ошибки синтаксического анализа шаблона. Пожалуйста, смотрите ниже мой шаблон кода, трубы и какую ошибку дали. Надеюсь, кто-нибудь может мне помочь.

Я работаю с Angular 7, Node.Js API и MongoDB. 

Template

<div class="template_right">
    <p>Snippets</p>
    <div class="styled">
        <select [(ngModel)]="filterText">
            <option 
                *ngFor="let showsnippets_categorie of showsnippets_categories" 
                [(ngValue)]="showsnippets_categorie.snippet_category_name">
                {{showsnippets_categorie.snippet_category_name}}
            </option>
        </select>
    </div>
    <span (click)="addCategory()">Add Category</span>                        
    <span *ngFor="let showsnippet of showsnippets | emailfilter: filterText " (click)="getSnippetId(showsnippet)">{{showsnippet.snippet_name}}</span>
</div>

Pipe


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

@Pipe({
 name: 'emailfilter',
 pure: false
})
export class EmailfilterPipe implements PipeTransform {

 transform(value: any, args?: any): any {
   return value.filter(items=>{
     return items.snippet_category.startsWith(args) == true
   });
 }

}

// And

import { Pipe, PipeTransform } from '@angular/core';
import { filter } from 'rxjs/operators';
@Pipe({
 name: 'filter'
})
export class FilterPipe implements PipeTransform {

     transform( items: any = [], args: string ):any {
       if (items != null && args != undefined && args  != ''){
           return items.filter(item=>item.snippet_category.indexOf(args)!== -1);
       }
       console.log("else")
       return items;
     }

}

Finally get the error below


core.js:14597 ERROR Error: Uncaught (in promise): Error: Template parse errors:
The pipe 'emailfilter' could not be found ("ategory()">Add Category</span>                        
                    <span *ngFor="let showsni[ERROR ->]ppet of showsnippets | emailfilter: filterText " (click)="getSnippetId(showsnippet)">{{showsnippet.sn"): ng:///AdminLayoutModule/EmailsComponent.html@37:45
Error: Template parse errors:
The pipe 'emailfilter' could not be found ("ategory()">Add Category</span>                        
                    <span *ngFor="let showsni[ERROR ->]ppet of showsnippets | emailfilter: filterText " (click)="getSnippetId(showsnippet)">{{showsnippet.sn"): ng:///AdminLayoutModule/EmailsComponent.html@37:45
    at syntaxError (compiler.js:2427)
    at TemplateParser.push../node_modules/@angular/compiler/fesm5/compiler.js.TemplateParser.parse (compiler.js:20311)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._parseTemplate (compiler.js:25857)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileTemplate (compiler.js:25844)
    at compiler.js:25787
    at Set.forEach (<anonymous>)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileComponents (compiler.js:25787)
    at compiler.js:25697
    at Object.then (compiler.js:2418)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileModuleAndComponents (compiler.js:25696)
    at resolvePromise (zone.js:814)
    at resolvePromise (zone.js:771)
    at zone.js:873
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:16147)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
    at drainMicroTaskQueue (zone.js:595)

Я хочу отфильтровать snippet_name по snippet_category из выпадающего списка, но, к сожалению, он не работает.

1 Ответ

1 голос
/ 24 апреля 2019

Пожалуйста, добавьте EmailfilterPipe в соответствующую декларацию модуля.

...