Diff filter for angular.js. Show inline text diff in your page
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
This repo is archived. You can view files and clone it, but cannot push or open issues/pull-requests.
 
Chakib Benziane c4bc6b70ac Update bower.json 5 years ago
src Minor fix: don't pollute the global namespace 6 years ago
tests Make it return safe html 6 years ago
.gitignore Init files 6 years ago
.jshintrc Init files 6 years ago
LICENSE Initial commit 6 years ago
README.md Minor edits to README 6 years ago
angular-diff.js Minor fix: don't pollute the global namespace 6 years ago
angular-diff.min.js Minor fix: don't pollute the global namespace 6 years ago
bower.json Update bower.json 5 years ago
gulpfile.js Init files 6 years ago
karma.conf.js Rename karma config file 6 years ago
package.json Minor fix: don't pollute the global namespace 6 years ago

README.md

angular-diff

Diff filter for angular.js. Show inline text diff in your page

I took the idea and the algorithm (and the code) from http://ejohn.org/projects/javascript-diff-algorithm/

Install

To use angular-diff you have to:

  1. install angular-diff with bower:

    bower install angular-diff

  2. In your index.html, include the angular-diff file

In your module declaration you have to include the diff module

var module = angular.module('yourModule', [
    ...
    'diff',
]);

USAGE

It's a filter, you use it in your html like this:

<div ng-bind-html="oldText|diff:newText"></div>

This will show the diff between oldText and newText

Note that the filter returns html with <ins> and <del> tags, so in order to display it you have to use ng-bind-html.

Here's a demo, that's worth more than a thousand words:

http://plnkr.co/edit/nfhA5g?p=preview

DEVELOPMENT

Remember to install all dependencies:

$ npm install -g gulp  // It's like grunt but cooler
$ npm install
$ bower install

To launch tests simply run

gulp karma

To build and minify simply run

gulp build