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

メナヘムギル

リンクの配列があり、各要素は、リンク、説明、カテゴリなど、いくつかの文字列を含むオブジェクトです。リンクを表示するさまざまなコンポーネントがあり、各コンポーネントでそのカテゴリのリンクのみを表示したいと思います。そのため、カテゴリで配列をフィルタリングしたいと思います。

すべてのリンクを含むモックアップ配列があります。

パイプなしでオブジェクトの配列をフィルタリングしようとしています。理由:https//angular.io/guide/pipes#appendix-no-filterpipe-or-orderbypipe

どうやらAngularチームは、パイプを使用せずにコンポーネントレベルでフィルタリングを行うことを提案しているようです。「Angularチームと多くの経験豊富なAngular開発者は、フィルタリングと並べ替えのロジックをコンポーネント自体に移動することを強くお勧めします。」

これが私のコンポーネントです:

@Component({
    selector: 'startups',
    templateUrl: './startups.component.html'
})

export class StartupsComponent implements OnInit {

constructor(private appLinksService: DigitalCoinHubService) { }

title = 'Startups';


links: DCHlinks[]; // create a new array in type of DCHlinks to get the data

startupsLinks: DCHlinks [] = []; // will build the startsups links only 


getLinks(): void {
  this.links = this.appLinksService.getLinks(); // gets the array with the data from the service

  for (let i in this.links)
  {
     if (this.links[i].dchCategory == 'startups' )
     {
         this.startupsLinks[i].push(this.links[i]);
     }

  }

}

ngOnInit() {
    this.getLinks();   

}

}

したがって、最初にサービスから大きな配列を取得します。

this.links = this.appLinksService.getLinks();

次に、関連するリンクのみを含む新しい配列を作成しようとします。フィルタはカテゴリ別です。しかし、カテゴリが一致する要素をプッシュして新しい配列を作成しようとすると、エラーが発生します。

プロパティ「push」はタイプ「DCHlinks」に存在しません。

DCHlinksはオブジェクトです-これはクラスです:

export class DCHlinks {
   dchLink: string;
   dchLinkTitle: string;
   dchLinkDescription: string;
   dchCategory: string;
 }

この単純なフィルターを実行する方法はありますか?(そしてパイプなし-上記の理由を参照してください..)

ありがとう!

Sajeetharan

のようにアレイを初期化する必要があります startupsLinks

links: DCHlinks[] = [];

または、array.filterを使用して関連データを取得することもできます

this.startupsLinks = this.links.filter(t=>t.dchCategory == 'startups');

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

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

編集
0

コメントを追加

0

関連記事

分類Dev

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

分類Dev

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

分類Dev

プロパティを比較してオブジェクトの配列をフィルタリングする

分類Dev

金額プロパティでオブジェクトの配列をフィルタリングする

分類Dev

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

分類Dev

オブジェクトの配列のプロパティ値ではない値で配列をフィルタリングする-Javascript

分類Dev

Angular4オブジェクトの配列をグループ化する

分類Dev

Angular4オブジェクトの配列をグループ化する

分類Dev

配列内のオブジェクトのプロパティをフィルタリングする方法

分類Dev

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

分類Dev

配列プロパティのサブセットのみを含むオブジェクトでJavaScript配列をフィルタリングします

分類Dev

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

分類Dev

Swiftの値の配列を使用して、プロパティでオブジェクトの配列をフィルタリングします

分類Dev

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

分類Dev

オブジェクトのプロパティである配列を不変の方法でフィルタリングします

分類Dev

jqを使用して要素のプロパティ値でオブジェクトの配列をフィルタリングする方法

分類Dev

jqを使用して要素のプロパティ値でオブジェクトの配列をフィルタリングする方法

分類Dev

jqを使用して要素のプロパティ値でオブジェクトの配列をフィルタリングする方法

分類Dev

異なるプロパティを持つオブジェクトの配列を再帰的にフィルタリングします

分類Dev

オブジェクトの配列をオブジェクトでフィルタリングする方法は?

分類Dev

オブジェクトでオブジェクトの配列をフィルタリングする方法

分類Dev

オブジェクトの配列をインデックスでフィルタリングする

分類Dev

lodash:空でない配列の値でオブジェクトをフィルタリングします

分類Dev

ネストされたループのない配列を使用してオブジェクトの配列をフィルタリングするjs

分類Dev

lodash:オブジェクトの配列が異なるオブジェクトの配列をフィルタリングします

分類Dev

値のサブ配列でオブジェクトの配列をフィルタリングする

分類Dev

Javascript:文字列の配列でオブジェクトの配列をフィルタリングします

分類Dev

オブジェクトの配列をフィルタリングし、配列内の複数のオブジェクトが同じプロパティ値のパンを持っているかどうかをJavaScriptで「エンタープライズ」に確認する方法

分類Dev

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

Related 関連記事

  1. 1

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

  2. 2

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

  3. 3

    プロパティを比較してオブジェクトの配列をフィルタリングする

  4. 4

    金額プロパティでオブジェクトの配列をフィルタリングする

  5. 5

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

  6. 6

    オブジェクトの配列のプロパティ値ではない値で配列をフィルタリングする-Javascript

  7. 7

    Angular4オブジェクトの配列をグループ化する

  8. 8

    Angular4オブジェクトの配列をグループ化する

  9. 9

    配列内のオブジェクトのプロパティをフィルタリングする方法

  10. 10

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

  11. 11

    配列プロパティのサブセットのみを含むオブジェクトでJavaScript配列をフィルタリングします

  12. 12

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

  13. 13

    Swiftの値の配列を使用して、プロパティでオブジェクトの配列をフィルタリングします

  14. 14

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

  15. 15

    オブジェクトのプロパティである配列を不変の方法でフィルタリングします

  16. 16

    jqを使用して要素のプロパティ値でオブジェクトの配列をフィルタリングする方法

  17. 17

    jqを使用して要素のプロパティ値でオブジェクトの配列をフィルタリングする方法

  18. 18

    jqを使用して要素のプロパティ値でオブジェクトの配列をフィルタリングする方法

  19. 19

    異なるプロパティを持つオブジェクトの配列を再帰的にフィルタリングします

  20. 20

    オブジェクトの配列をオブジェクトでフィルタリングする方法は?

  21. 21

    オブジェクトでオブジェクトの配列をフィルタリングする方法

  22. 22

    オブジェクトの配列をインデックスでフィルタリングする

  23. 23

    lodash:空でない配列の値でオブジェクトをフィルタリングします

  24. 24

    ネストされたループのない配列を使用してオブジェクトの配列をフィルタリングするjs

  25. 25

    lodash:オブジェクトの配列が異なるオブジェクトの配列をフィルタリングします

  26. 26

    値のサブ配列でオブジェクトの配列をフィルタリングする

  27. 27

    Javascript:文字列の配列でオブジェクトの配列をフィルタリングします

  28. 28

    オブジェクトの配列をフィルタリングし、配列内の複数のオブジェクトが同じプロパティ値のパンを持っているかどうかをJavaScriptで「エンタープライズ」に確認する方法

  29. 29

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

ホットタグ

アーカイブ