イオンフィルタコンポーネントで表示する単語の数

Question

私のイオニアアプリに問題があります。問題は、私は長すぎるサイトからテキストを取り込んでいます、私はイオンカードのためにそれを簡素化したいと思います。私は、特定の単語の後に{...}を単純に解決するパイプを試してみました。

<ion-content class="Content"> 

<ion-card *ngFor='let rest of modifiedData' (click)="itemSelected(rest.PushPage)" > 
    <img src={{rest.image}}/> 
    <ion-card-content > 
    <ion-card-title> 
    <h1>{{rest.name}}</h1> 
     </ion-card-title> 
    <p>{{rest.text}}</p> 
    </ion-card-content> 
</ion-card> 

アシストをしてください。以下は、私のカードのコードで、{{rest.textは}}私はサイズを制限したいものです。

Answer 1

シャープにしたいテキストをパラメータtextとし、sizeにするフィルタを作成します。フィルタのチェックインサイド

if(text.length > size) { 
    return text.substr(0, size) 
else { 
    return text 
} 

Answer 2

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

@Pipe({ 
name: 'words' 
}) 
export class TruncateWordsPipe implements PipeTransform { 
transform(value: string, limit: number = 40, trail: String = '…'): string { 
let result = value || ''; 

if (value) { 
    let words = value.split(/\s+/); 
    if (words.length > Math.abs(limit)) { 
    if (limit < 0) { 
     limit *= -1; 
     result = trail + words.slice(words.length - limit, words.length).join(' '); 
    } else { 
     result = words.slice(0, limit).join(' ') + trail; 
    } 
    } 
} 

return result; 

}}

Text to Truncate angular4 directive