角度2のカスタムパイプでサービスを使用する方法

Question

htmlで何ヶ月も表示したい。私のフィルタは入力として数ヶ月を要し、年を返します。

たとえば、入力に12を入力すると、変換された値が1年として返されます。 1年以上経過した場合は「2年」を返します。

私のパイプが含まれています

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

@Pipe({name : 'displayMonthsInYears '}) 
export class DisplayMonthsInYears implements PipeTransform{ 
    transform(noOfMonths : number) : any { 
     if(noOfMonths > 12){ 
      return (noOfMonths/12 + $translate.instace('YEARS')); 
     } 
     return (noOfMonths/12 + $translate.instace('YEAR')); 
    } 
} 

とHTMLは次のとおりです。

<div class="text-left"> 
    {{ contractDuration | displayMonthsInYears }} 
</div> 

私はそれを実現するためにどのような手掛かりを持っていません。助けてください。

Answer 1

npm install @ngx-translate/core @ngx-translate/http-loader --save 

に変換libとそのHTTP-ローダーをインストールするには、@ngx-translateドキュメントでセットアップガイドに従ってください。

import {TranslateService} from '@ngx-translate/core'; 

があなたの配管に注入し、このようにそれを使用します：次にサービスをインポート

@Pipe({name : 'displayMonthsInYears '}) 

export class DisplayMonthsInYears implements PipeTransform{ 

    constructor(private translate: TranslateService) {} 

    transform(noOfMonths : number) : any { 

    if (noOfMonths > 12) { 
     return (noOfMonths/12 + this.translate.instant('YEARS')); 
    } 

    return (noOfMonths/12 + this.translate.instant('YEAR')); 
    } 
} 

instantもあります、すぐに値を返しますようにあなたを与えるだろうstreamとして有用なものあなたのサブスクリプションに価値をストリーミングし続けるでしょう。どちらがgetしません。より多くの方法がありますので、ドキュメントを見て、どれが最適かを知ることをお勧めします。