Check out the live demo
Extension of ember-changeset, providing undo/redo features. Also ships with a debounced-value helper for grouping changes together
To install:
ember install ember-changeset-history
Create a new changeset
// omitting maxHistoryLength option or setting to 0 keeps infinite history
ChangesetHistory(model, validator, {}, { maxHistoryLength: 0 });
import Ember from 'ember';
import ChangesetWithHistory from 'ember-changeset-history';
const { Component, computed } = Ember;
export default Component.extend({
init() {
this._super(...arguments);
this.changeset = new ChangesetWithHistory(this.get('model'), () => true, {}, { maxHistoryLength: 100});
},
undoDisabled: computed.not('changeset.canUndo'),
actions: {
undo() {
this.changeset.undo();
}
}
});
- Properties
- Methods
Returns a Boolean - true if there is something that can be undone in the changeset
get(changeset, 'canUndo'); // true
Returns a Boolean - true if there is something that can be redone in the changeset
get(changeset, 'canRedo'); // false
Undoes the last change made to the changeset, if there is one available:
changeset.undo();
Redoes the last change made to the changeset, if some changes have been undo:
changeset.redo();
Removes all stored history for a changeset. Can be useful if rolling back a changeset and you want to destroy previous history:
changeset.resetHistory();
Yields an action which is debounced.
- Properties
The time in milliseconds to debounce changes. The default is 400.
The property to debounce changes to. Not required if you're updating the property yourselve via the onchange action
Will be send along with the new value to the onChange action, if one is provided
Action to fire after changes have been debounced. If this is not provided, the value will be mutated by debounced-value component directly.
actions: {
customSetter(propertyPath, newValue) {
this.set(propertyPath, newValue);
}
}
-
npm test
(Runsember try:each
to test your addon against multiple Ember versions) ember test
ember test --server
ember build
For more information on using ember-cli, visit https://ember-cli.com/.