Ngx Text Diff

Overview

If you are working with Angular and need to implement a robust text comparison tool, ngx-text-diff could be just what you need. Built on the reliable Google diff-match-patch library, this component allows seamless side-by-side comparisons of any two pieces of text, highlighting the differences in a clear and intuitive format. It’s designed for easy integration and customization within Angular applications, making it a great choice for developers looking to enhance functionality and user experience.

The ngx-text-diff component simplifies the process of comparing text, whether it’s for code reviews, document revisions, or any text-heavy application. With its various features and customization options, this tool adapitates to your specific needs while providing a user-friendly interface.

Features

• Easy Installation: Quickly integrate into your Angular project with a simple npm install ngx-text-diff command.
• Required Packages: Ensures compatibility with Angular 6 and above, requiring @angular/common, @angular/core, and @angular/forms among others.
• Input Flexibility: Accepts two strings as input (left and right) for comparison, making it straightforward to use.
• Loading Spinner: Optional loading spinner can be displayed by toggling the loading input, enhancing user experience during processing.
• Custom Formatting: Choose between SideBySide and LineByLine formats for displaying differences, allowing users to select their preferred view.
• Customize Visibility: Options to hide matching lines and show/hide toolbars provide flexibility for different application needs.
• Styling Capabilities: Support for custom styles and classes for the outer container and toolbar, enabling you to align the component with your app’s theme.
• Observable Support: Includes an optional diffContent observable for more advanced use cases, making it suitable for reactive programming.