Skip to content

Commit 2061ce7

Browse files
committed
Update README
1 parent 8913ed3 commit 2061ce7

File tree

2 files changed

+84
-14
lines changed

2 files changed

+84
-14
lines changed

README.md

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ A simple text diff component for Angular, based on [diff-match-patch](https://gi
44

55
## Demo
66

7-
[ngx-diff2html Demo](#)
7+
[ngx-diff2html Demo](https://axel-dev.github.io/ngx-diff2html)
88

99
## Installation
1010

@@ -25,14 +25,14 @@ npm install --save ngx-diff2html
2525
| left | string | Yes | First text to be compared
2626
| right | string | Yes | Second text to be compared
2727
| filename | string | Optional, default: ` ` (white space) | Can be used to display a filename in the top of diff results. **Cannot be null or empty**
28-
| format | `DiffFormat` | Optional, default: `side-by-side` | Possible values:<br> -`side-by-side`<br> -`line-by-line`
29-
| style | `DiffStyle` | Optional, default: `word` | Possible values:<br> -`word`<br> -`char`
28+
| format | `DiffFormat` | Optional, default: `side-by-side` | Possible values:<br> - `side-by-side`<br> - `line-by-line`
29+
| style | `DiffStyle` | Optional, default: `word` | Possible values:<br> - `word`<br> - `char`
3030

3131
### Outputs
3232

3333
| Output | Type | Required | Description
3434
| -------------------- | ----------------- | ------------------------------------ | --------------------------
35-
| diffChange | string | Optional | Event fired when diff changes. The returned value is the diff in [unified format](http://fileformats.archiveteam.org/wiki/Unified_diff)
35+
| diffChange | string | Optional | Event fired when diff changes. The returned value is the text diff in [unified format](http://fileformats.archiveteam.org/wiki/Unified_diff)
3636

3737
## Usage
3838

@@ -73,6 +73,14 @@ npm install --save ngx-diff2html
7373
/>
7474
```
7575

76+
## Build
77+
78+
Run `ng build ngx-diff2html` to build the project. The build artifacts will be stored in the `dist/` directory.
79+
80+
## Publishing
81+
82+
After building your library with `ng build ngx-diff2html`, go to the dist folder `cd dist/ngx-diff2html` and run `npm publish`.
83+
7684
## License
7785

7886
This project is licensed under the [MIT](LICENSE) license.

projects/ngx-diff2html/README.md

Lines changed: 72 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,77 @@
11
# NgxDiff2html
22

3-
This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 8.2.14.
3+
A simple text diff component for Angular, based on [diff-match-patch](https://github.com/google/diff-match-patch) & [diff2html](https://github.com/rtfpessoa/diff2html).
44

5-
## Code scaffolding
5+
## Demo
66

7-
Run `ng generate component component-name --project ngx-diff2html` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project ngx-diff2html`.
8-
> Note: Don't forget to add `--project ngx-diff2html` or else it will be added to the default project in your `angular.json` file.
7+
[ngx-diff2html Demo](https://axel-dev.github.io/ngx-diff2html)
8+
9+
## Installation
10+
11+
```
12+
npm install --save ngx-diff2html
13+
```
14+
15+
## API
16+
17+
- module: `NgxDiff2htmlModule`
18+
- component: `NgxDiff2htmlComponent`
19+
- selector: `ngx-diff2html`
20+
21+
### Inputs
22+
23+
| Input | Type | Required | Description
24+
| -------------------- | ----------------- | ------------------------------------ | --------------------------
25+
| left | string | Yes | First text to be compared
26+
| right | string | Yes | Second text to be compared
27+
| filename | string | Optional, default: ` ` (white space) | Can be used to display a filename in the top of diff results. **Cannot be null or empty**
28+
| format | `DiffFormat` | Optional, default: `side-by-side` | Possible values:<br> - `side-by-side`<br> - `line-by-line`
29+
| style | `DiffStyle` | Optional, default: `word` | Possible values:<br> - `word`<br> - `char`
30+
31+
### Outputs
32+
33+
| Output | Type | Required | Description
34+
| -------------------- | ----------------- | ------------------------------------ | --------------------------
35+
| diffChange | string | Optional | Event fired when diff changes. The returned value is the text diff in [unified format](http://fileformats.archiveteam.org/wiki/Unified_diff)
36+
37+
## Usage
38+
39+
1) Register the `NgxDiff2htmlModule` in a module, for example app module:
40+
41+
```diff
42+
import { BrowserModule } from '@angular/platform-browser';
43+
import { NgModule } from '@angular/core';
44+
45+
import { AppComponent } from './app.component';
46+
+ import { NgxDiff2htmlModule } from 'ngx-diff2html';
47+
48+
@NgModule({
49+
declarations: [AppComponent],
50+
imports: [
51+
BrowserModule,
52+
+ NgxDiff2htmlModule
53+
],
54+
providers: [],
55+
bootstrap: [AppComponent]
56+
})
57+
export class AppModule {}
58+
```
59+
60+
2) Add the following line to `polyfills.ts`:
61+
62+
```diff
63+
// Add global to window, assigning the value of window itself.
64+
+ (window as any).global = window;
65+
```
66+
67+
3) Start using the component:
68+
69+
```
70+
<ngx-diff2html
71+
left="some text"
72+
right="some other text"
73+
/>
74+
```
975

1076
## Build
1177

@@ -15,10 +81,6 @@ Run `ng build ngx-diff2html` to build the project. The build artifacts will be s
1581

1682
After building your library with `ng build ngx-diff2html`, go to the dist folder `cd dist/ngx-diff2html` and run `npm publish`.
1783

18-
## Running unit tests
19-
20-
Run `ng test ngx-diff2html` to execute the unit tests via [Karma](https://karma-runner.github.io).
21-
22-
## Further help
84+
## License
2385

24-
To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).
86+
This project is licensed under the [MIT](LICENSE) license.

0 commit comments

Comments
 (0)