Polymer Element that wraps josdejong/jsoneditor and adds two-way binding for edited JSON.
Install the component using Bower:
$ bower install juicy-jsoneditor --save
Or download as ZIP.
Import Web Components' polyfill, if needed:
<script src="https://github.com/Juicy/juicy-jsoneditor/raw/master/bower_components/webcomponentsjs/webcomponents.min.js"></script>
Import Custom Element:
<link rel="import" href="https://github.com/Juicy/juicy-jsoneditor/blob/master/bower_components/juicy-jsoneditor/juicy-jsoneditor.html">
<!-- josdejong/jsoneditor#104 workaround-->
<link rel="stylesheet" type="text/css" href="https://github.com/Juicy/juicy-jsoneditor/blob/master/bower_components/jsoneditor/jsoneditor.min.css">
Start using it!
<juicy-jsoneditor></juicy-jsoneditor>
Attribute | Options | Default | Description |
---|---|---|---|
json |
Object | {} |
JSON to edit. This could be object reference given via property or stringified JSON via attribute |
mode |
String | tree |
Editing mode, see API |
modes |
Array of Strings | List of editing modes to be available, see API | |
name |
String | Object name, see API | |
search |
Boolean | true |
Toggle search box, see API |
indentation |
Number | 2 |
Indentation, see API |
history |
Boolean | true |
Toggle history - undo, redo, see API |
All attributes, plus:
Name | Type | Description |
---|---|---|
editor |
JSONEditor | JSONEditor instance. |
set
,setMode
,setName
,setText
,get
,getName
,getText
delegated to JSONEditor
's methods
Event | event.details | Description |
---|---|---|
change |
{action: "JSONEditor-action", params: {..} } |
Triggers when json changes. |
juicy-jsoneditor
is a hybrid element. For detailed changelog, check Releases.
<juicy-jsoneditor>
MITjosdejong/JSONEditor
Apache License