ravi-dhiman-tas / ng2-truncate-toggle

ng2-truncate-toggle

Installation

1. You can install ng2-truncate-toggle using npm

npm install ng2-truncate-toggle --save

API

Import

import { NgTruncateToggle } from 'ng2-truncate-toggle';

// In your App's module:
imports: [
   NgTruncateToggle
]

Usage

{{ longString | truncate: 20 }}

Truncate with controls

<truncate-text
    [source]="sourceString"
    [max-length]="100"
></truncate-text>

All options for truncate controls

<truncate-text
    [show-less-text]="'Less'"
    [show-more-text]="'More'"
    [source]="sourceString"
    [max-length]="100"
    [elipse]="..."
    [show-controls]="true"
></truncate-text>

Event

<truncate-text
    (onChange)="callback($event)"
></truncate-text>

onChange: Fires when you toggle text with controls.

Thanks for understanding!

License

The MIT License (see the LICENSE file for the full text)

ng2-truncate-toggle's Issues

Error in Angular 5.2.7

Apparently, Angular has changed the package format, and the current format of this package is no longer valid:

ERROR in ./node_modules/ng2-truncate-toggle/src/truncate.module.ts
Module build failed: Error: [my-project]/node_modules/ng2-truncate-toggle/src/truncate.module.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.
The missing file seems to be part of a third party library. TS files in published libraries are often a sign of a badly packaged library. Please open an issue in the library repository to alert its author and ask them to package the library using the Angular Package Format (https://goo.gl/jB3GVv).
    at AngularCompilerPlugin.getCompiledFile ([my-project]/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:674:23)
    at plugin.done.then ([my-project]/node_modules/@ngtools/webpack/src/loader.js:467:39)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)

String value <= maxLength when using <truncate-text> only showing controls?

Great package and thanks for it! Not sure if this is a bug or intended, but while using <truncate-text> and setting a [max-length] , if the [source] length is less than the max length, the text is cut-off and only the ellipse and 'More' show. I was wondering if that was intended to be calculated to use the 'More/Less' option when the case calls for it or not. I could be wrong, but I think this could be done with these edits to the current codebase.

EDITS on line 119 in truncate.component.ts file:
this.isControlShown = s.length > l ? true : false;

EDITS on line 33 in truncate.pipe.ts file:
if (value.length > maxLength) { return this.splitSource(value, maxLength); } else { return value; }

Any thoughts on this? Thanks!