DEV Community

Cover image for How to show less content in Angular
Vic-rider
Vic-rider

Posted on

1

How to show less content in Angular

Made by @Vic-rider

NgxLessTextPipe

This pipe is created to help show less content like emails, descriptions, details.

Install

Run npm i ngx-less-text-pipe to install it.

Import

Navigate to the module or standalone component in which you want to use.


import { NgxLessTextModule } from "ngx-less-text-pipe";

@NgModule({
  declarations: [
  ],
  imports: [
    BrowserModule,
    NgxLessTextModule
  ],
  providers: [],
})
export class ProductsModule { }

Enter fullscreen mode Exit fullscreen mode

Use

You have to go to your template where you want to use lessText pipe.

<p> {{ product.description | lessText:'100' }} </p>
Enter fullscreen mode Exit fullscreen mode

Here, 100 represents the number of characters you want to display.

Top comments (0)

Image of Docusign

🛠️ Bring your solution into Docusign. Reach over 1.6M customers.

Docusign is now extensible. Overcome challenges with disconnected products and inaccessible data by bringing your solutions into Docusign and publishing to 1.6M customers in the App Center.

Learn more