Skip to content

Commit

Permalink
docs(project): enhanced the readme with the options argument #44
Browse files Browse the repository at this point in the history
  • Loading branch information
AnthonyNahas committed Jan 10, 2019
1 parent 56c9155 commit 4a16227
Showing 1 changed file with 61 additions and 3 deletions.
64 changes: 61 additions & 3 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -117,6 +117,38 @@ export class OtherModule {

Once the library is imported, you can use its components, directives and pipes in your Angular application:

### Options

`ngx-linkifyjs` provides an appropriate option interface called `NgxLinkifyOptions` to access [the native options of the linkifyjs library](https://soapbox.github.io/linkifyjs/docs/options.html)
and all of them are optional
- Default values

```typescript

import { NgxLinkifyOptions } from 'ngx-linkifyjs';

const options: NgxLinkifyOptions =
{
attributes: null,
className: 'linkified',
defaultProtocol: 'http',
events: null,
format: function (value, type) {
return value;
},
formatHref: function (href, type) {
return href;
},
ignoreTags: [],
nl2br: false,
tagName: 'a',
target: {
url: '_blank'
},
validate: true
};
```

### Pipe

`{{text | linkify}}`
Expand All @@ -127,6 +159,13 @@ Once the library is imported, you can use its components, directives and pipes i

**result**: Linkify the following URL: [https://github.com/anthonynahas/ngx-linkifyjs](https://github.com/anthonynahas/ngx-linkifyjs) and share it <3

if you prefer to provide your own option to the `pipe`, you can use it like the following:

- `{{text | linkify: 'options' }}`
- `{{text | linkify: '{/*your options*/}' }}`
- `{{text | linkify: '{target {url: "_self" }}' }}`


### Service

Inject the `NgxLinkifyjsService` service
Expand All @@ -141,31 +180,50 @@ constructor(public linkifyService: NgxLinkifyjsService) {

<a name="linkify_method"/>

#### linkify _(text: string): string_
#### linkify _(text: string, options?: NgxLinkifyOptions): string_

Convert a basic text string to a valid linkified text

**Params**

* **`text`** : _`String`_ Text to linkify --> to convert with links
* **`options`** : _`NgxLinkifyjsService`_ options to pass it to the linkifyjs library and it's optional

**Returns** _`String`_ converted text with links


```typescript
import {NgxLinkifyjsService, Link, LinkType} from 'ngx-linkifyjs';
import {NgxLinkifyjsService, Link, LinkType, NgxLinkifyOptions} from 'ngx-linkifyjs';

constructor(public linkifyService: NgxLinkifyjsService) {

const options: NgxLinkifyOptions =
{
className: 'linkifiedYES',
target : {
url : '_self'
}
};

this.linkifyService.linkify('For help with GitHub.com, please email [email protected]');
// result --> see below
// result 1 --> see below

this.linkifyService.linkify('For help with GitHub.com, please email [email protected]', options);
// result 2 --> see below
}
}
```

result 1
```typescript
'For help with <a href=\"http://github.com\" class=\"linkified\" target=\"_blank\">GitHub.com</a>, please email <a href=\"mailto:[email protected]\" class=\"linkified\">[email protected]</a>'
```

result 2
```typescript
'For help with <a href=\"http://github.com\" class=\"linkifiedYES\" target=\"_self\">GitHub.com</a>, please email <a href=\"mailto:[email protected]\" class=\"linkifiedYES\">[email protected]</a>'
```

#### `find` method

Finds all links in the given string
Expand Down

0 comments on commit 4a16227

Please sign in to comment.