Angular2 RegExpを使用してパイプでオブジェクトの配列をフィルタリングしますか?

アヴラムウェルギリウス

stackoverflowとgoogleで何時間も検索した後、検索しているものが見つかりませんでしたが、別の解決策のアイデアを得ることができました。

オブジェクトの例:

items = [
{
    title: "This is title", 
    email: "[email protected]",
    status: "confirmed"
},
{
    title: "This another one", 
    email: "[email protected]",
    status: "pending"
{    
    title: "Just a random string", 
    email: "[email protected]",
    status: "pending"
{    
]

解決策:

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

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

  transform(value: any, args?: any): any {
    if(args == '') { return value; }

    let query = args.toLowerCase();
    return value.filter(task =>
      task.title.toLowerCase().indexOf(query) > -1 ||
      task.email.toLowerCase().indexOf(query) > -1 ||
      task.status.toLowerCase().indexOf(query) > -1 

    );
    
  }
}

<div *ngFor="item of (items | filter:'this is') ">
   {{item | json}}
 </div>

これは私に与えるでしょう:

{title: "This is title", email: "[email protected]",status: "confirmed"}

そのまま動作しますが、RegExpで動作させるつもりでした。試しましたが、varsomething = new RegExp(// some rule)を使用すると、何らかの理由でエラーが発生しました。

どんなアイデアでも大歓迎です。

エルワン

これを試して

import {Pipe} from 'angular2/core';

// Tell Angular2 we're creating a Pipe with TypeScript decorators
@Pipe({
  name: 'RegexPipe'
})
export class RegexPipe {

  transform(value, args?) {
    // ES6 array destructuring
    let [pattern] = args;
    return value.filter(task => {
        reg = new Regex(pattern);
        found = reg.test(task.title);
      return found;
    });
  }

}

<div *ngFor="item of (items | RegexPipe:'/this is (.)*/') ">
   {{item | json}}
 </div>

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

パイプを使用したオブジェクトの配列に基づくオブジェクトのAngular2フィルタリング配列

分類Dev

パイプAngular2でオブジェクト配列をフィルタリングする

分類Dev

lodashを使用して単一のプロパティでオブジェクトの2つの配列をフィルタリング/比較する方法は?

分類Dev

Angular.jsの共通オブジェクトプロパティで配列をフィルタリングしますか?

分類Dev

Angular-オブジェクトの別の配列の値に基づいてオブジェクトの配列をフィルタリングします

分類Dev

パイプなしでAngular4のオブジェクトの配列をフィルタリングする

分類Dev

Knockoutjsテンプレート:いくつかのプロパティで配列をフィルタリングした後、2つのDOM要素に1つのオブジェクト配列を使用するにはどうすればよいですか?

分類Dev

Javascript(UnderscoreJS)の2番目のオブジェクト配列に基づいてオブジェクト配列1をフィルタリングします

分類Dev

オブジェクトの配列でフィルタリングし、条件について2番目の配列をforeachします

分類Dev

Angular2のオブジェクトの配列のプロパティ値に基づいてフィルタリングする方法は?

分類Dev

最後から2番目のおろし金のタイムスタンプ(日付)に基づいて、同じ期間の値を持つオブジェクトの配列をフィルタリングしますか?

分類Dev

Typescriptはオブジェクトの2つの配列をフィルタリングします

分類Dev

オブジェクトの2つの配列をフィルタリングします

分類Dev

Javascriptを使用してネストされたオブジェクトで2つの配列をフィルタリングする

分類Dev

Angular2パイプはHTML文字列のリンクをフィルタリングします

分類Dev

Angular2 / Typescript:パイプを介してオブジェクトの配列を取得する方法は?

分類Dev

2つのオブジェクト配列をフィルタリングして効率的に処理するにはどうすればよいですか?

分類Dev

Angular:Rxjsはオブジェクトの配列を介してプロパティでフィルタリングするにはどうすればよいですか?

分類Dev

2番目の配列のオブジェクトプロパティの値と比較して、フィルタリングされた配列を1回返します

分類Dev

オブジェクト内の要素が異なるオブジェクトの2つの配列を比較して、配列をフィルタリングするにはどうすればよいですか?

分類Dev

2つの配列をオブジェクトと比較して、類似している配列をフィルタリングする方法(vanilla JS)

分類Dev

ラムダを使用して、第2レベルのリスト内のオブジェクトのプロパティでリストをフィルタリングするにはどうすればよいですか?

分類Dev

オブジェクトの2つの配列を比較し、結果の配列をフィルタリングします

分類Dev

配列プロパティを持つAngular2 SearchPipeフィルターオブジェクト

分類Dev

Javaの8ストリームを使用して2つのアレイ複合オブジェクト要素をフィルタリングします

分類Dev

Angular2 +を使用してJSONファイル内のIDでオブジェクトを検索する

分類Dev

オブジェクト内の配列を介したAngular2ループ

分類Dev

Angular2パイプを使用してオブジェクトのリストを並べ替える方法

分類Dev

Angular2パイプを使用してオブジェクトのリストを並べ替える方法

Related 関連記事

  1. 1

    パイプを使用したオブジェクトの配列に基づくオブジェクトのAngular2フィルタリング配列

  2. 2

    パイプAngular2でオブジェクト配列をフィルタリングする

  3. 3

    lodashを使用して単一のプロパティでオブジェクトの2つの配列をフィルタリング/比較する方法は?

  4. 4

    Angular.jsの共通オブジェクトプロパティで配列をフィルタリングしますか?

  5. 5

    Angular-オブジェクトの別の配列の値に基づいてオブジェクトの配列をフィルタリングします

  6. 6

    パイプなしでAngular4のオブジェクトの配列をフィルタリングする

  7. 7

    Knockoutjsテンプレート:いくつかのプロパティで配列をフィルタリングした後、2つのDOM要素に1つのオブジェクト配列を使用するにはどうすればよいですか?

  8. 8

    Javascript(UnderscoreJS)の2番目のオブジェクト配列に基づいてオブジェクト配列1をフィルタリングします

  9. 9

    オブジェクトの配列でフィルタリングし、条件について2番目の配列をforeachします

  10. 10

    Angular2のオブジェクトの配列のプロパティ値に基づいてフィルタリングする方法は?

  11. 11

    最後から2番目のおろし金のタイムスタンプ(日付)に基づいて、同じ期間の値を持つオブジェクトの配列をフィルタリングしますか?

  12. 12

    Typescriptはオブジェクトの2つの配列をフィルタリングします

  13. 13

    オブジェクトの2つの配列をフィルタリングします

  14. 14

    Javascriptを使用してネストされたオブジェクトで2つの配列をフィルタリングする

  15. 15

    Angular2パイプはHTML文字列のリンクをフィルタリングします

  16. 16

    Angular2 / Typescript:パイプを介してオブジェクトの配列を取得する方法は?

  17. 17

    2つのオブジェクト配列をフィルタリングして効率的に処理するにはどうすればよいですか?

  18. 18

    Angular:Rxjsはオブジェクトの配列を介してプロパティでフィルタリングするにはどうすればよいですか?

  19. 19

    2番目の配列のオブジェクトプロパティの値と比較して、フィルタリングされた配列を1回返します

  20. 20

    オブジェクト内の要素が異なるオブジェクトの2つの配列を比較して、配列をフィルタリングするにはどうすればよいですか?

  21. 21

    2つの配列をオブジェクトと比較して、類似している配列をフィルタリングする方法(vanilla JS)

  22. 22

    ラムダを使用して、第2レベルのリスト内のオブジェクトのプロパティでリストをフィルタリングするにはどうすればよいですか?

  23. 23

    オブジェクトの2つの配列を比較し、結果の配列をフィルタリングします

  24. 24

    配列プロパティを持つAngular2 SearchPipeフィルターオブジェクト

  25. 25

    Javaの8ストリームを使用して2つのアレイ複合オブジェクト要素をフィルタリングします

  26. 26

    Angular2 +を使用してJSONファイル内のIDでオブジェクトを検索する

  27. 27

    オブジェクト内の配列を介したAngular2ループ

  28. 28

    Angular2パイプを使用してオブジェクトのリストを並べ替える方法

  29. 29

    Angular2パイプを使用してオブジェクトのリストを並べ替える方法

ホットタグ

アーカイブ