离子过滤要在组件中查看的单词数

时间:2022-05-04 23:01:50

I run to a problem with my Ionic app. The issue is i am taking in a text from a site that is too long and i wish to simplify it for my ionic card. I have tried coming up with a pipe that would simply make a{...} after a certain word count to no solution. Below is the code for my card, the {{rest.text}} is what i wish to limit the size:

我遇到了Ionic应用程序的问题。问题是我从一个太长的网站收集文本,我希望为我的离子卡简化它。我试过提出一个管道,只需在某个字数统计后无法解决问题就成了{...}。下面是我的卡的代码,{{rest.text}}是我希望限制的大小:

<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> 

please assist.

请协助。

2 个解决方案

#1


0  

Create a filter that take as params text the text that you want to make shirter and size how many characters you want it to be. Inside filter check

创建一个过滤器,将asms文本作为要制作衬衫的文本,并调整您想要的字符大小。内部过滤检查

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

#2


0  

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

文本截断angular4指令

#1


0  

Create a filter that take as params text the text that you want to make shirter and size how many characters you want it to be. Inside filter check

创建一个过滤器,将asms文本作为要制作衬衫的文本,并调整您想要的字符大小。内部过滤检查

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

#2


0  

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

文本截断angular4指令