Skip to content

rawatanimesh/angular-json-diff-jdd

Repository files navigation

JsonDiffChecker

This angular compoent has been created using source code from http://www.jsondiff.com/ tool. This is a reusable angular component which helps in showing differences between two JSON objects.

Demo

Checkout the demo - https://json-difference.web.app/

Capture

Adding the component in your project

1) Add the 'jdd' javascript files in your asset folder. You can copy it from this project from 'assets/jdd-files'.
2) Copy 'json-comparison' component from here to your project. Import it in your module.
3) Add the 'app-json-comparison' html template in your parent component to get output and input as well as json differences.
4) In your parent component add click on button with id 'compare' to get your results.
5) You can send true or false based on your requirement and show/hide things like difference report.
6) The output 'differenceReport' gives a detailed report on changes in JSON format which you can use for your purpose.

Author

Email - animesh.rawat20@gmail.com
Portfolio - https://animesh-rawat.web.app/