1.1.0 • Published 6 years ago
ngx-inline-edit v1.1.0
Angular Inline Edit
A directive for the inline-edit-js library
Installation
Install with NPM:
npm install ngx-inline-edit
Then, import the directive
import { InlineEditDirective } from 'ngx-inline-edit';
declarations: [
...
InlineEditDirective,
...
]
Basic Usage
Set a property in your component
export class YourComponent {
public editableString: string;
}
Then use that property with the inline edit directive
<div inlineEdit [(editable)]="editableString">
{{ editableString }}
</div>
onChange Callback
You can also pass a callback to the onChange event
export class YourComponent {
public editableString: string;
...
public editableChangeCallback(newValue: string, oldValue: string, elementRef: ElementRef) {
// handle new value
}
}
<div inlineEdit [(editable)]="editableString" [onChange]="editableChangeCallback">
{{ editableString }}
</div>
Options
editable
Type: string
Your editable property
onChange
Type: Function
Default: null
A callback that fires when the editable model changes, it passes back 3 parameters: newValue, oldValue, and a reference to the element.
1.1.0
6 years ago